{"componentChunkName":"component---src-templates-post-js","path":"/blog/config-files","webpackCompilationHash":"0f979b9b09e9513b4912","result":{"data":{"site":{"siteMetadata":{"keywords":["blog","ubug","tech blog","技术博客","playground"]}},"mdx":{"fields":{"title":"🔰 前端编辑器常见配置文件","tips":[],"categories":["code"],"datetime":"2019-11-27 01:17:36","noFooter":false,"description":"项目根目录会有很多配置文件，今天梳理一下有哪些，不是罗列，而是感叹下前端现在的工具和配置的 “艺术”","plainTextDescription":"项目根目录会有很多配置文件，今天梳理一下有哪些，不是罗列，而是感叹下前端现在的工具和配置的 “艺术”\n","author":"Ubug","banner":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='92'%3e%3cpath%20d='M0%2015l1%2016v1L0%2061c0%2027%200%2029%202%2028l8-1-6%202c-4%202-4%202%2010%202l14-1%201-2c0-2-1-2-9-2-5%200-8%200-7-1v-3l-1-1c1-1%2022-2%2024%200s12%201%2026%200c7-1%207-2%206-4-1-1-1-1-3%201-1%201-2%201-2-2l-2-7c-2-2-2-4%201-5l1-3-1-2-2-1c-2-1-2-1%201-1%205%200%207-3%209-10%201-6%205-9%208-5%200%201%202%202%205%202%205%200%209%202%2014%207%204%204%204%204%202%203-3%200-3%202%200%205%201%202%206%203%205%201-1-1%201-5%202-5l3-2%204-2%204-2%205-3c3-1%204-3%201-2l-1-3%202-3v2l1%202%202%201c2%201%202%201%203-2%202-3%203-2%202%203%200%202%204%204%205%203l4-1%203-1%204-2%206-3c2-1%202-1%200-3h-4l-5-1c-2-1-5-2-6-1l-3-1-3-5-3-4%202-2%203-4%201-2v-3c0-2-1-2-2%202-2%204-2%204-3%202l4-10%204-9H0v15M298%201c0%202%202%209%205%2011%202%203%201%203-2%201s-4-3-5-1l-5-1c-3-2-4-2-5-1-3%204-3%205-4%203%200-2-2-1-6%202-7%204-13%2016-9%2018l1%205c1%204%203%206%203%203h1l5%202c3%200%204%200%204-2h1c2%203%203%202%202%200v-2l1-1v-3h5c-1%201%202%201%206%201l7%201h-15l5%202c5%201%205%201%202%201l-4%202c-1%202-1%204%201%204l2%202h4c0%201%201%202%203%202%202-1%204%200%204%201h3c0-3%203-1%204%201%200%202%200%202%202%201%201-1%201-1%201%201%200%204%203%205%206%202l5-1c5%201%206%202%203%202l-3%201h3c3%200%203%202%200%202-2%201-2%201%200%202l1%201%201%202%202%203c-1%200-5-2-4-3l-1-1c-1%201-5%200-7-3-2-2-3-1-3%202l2%202%201%202%201%201%204%202%203%201h2c0%202%202%201%202-1l1-2c2%200%201%206-1%207l-2%201h2l4%201%203%202%203%201%206%201c5%200%206%200%206-2s0-2%202-1l4%202c2%200%202%200%201%201s-1%201%201%201l3-1h1l1%201%201-2%201-3c1%200%205%203%204%204l-2-1-2-1%201%202%208%202%207%201-1%201c-5-1-23%200-23%201l7%201c7-1%209%200%204%201l-6%202-4%202h9c9%200%2010%200%2010-2l2-3c2-1%202-1%202%202l-1%203h8c7%200%207%200%207-2l-1-3v-1l1-44V0h-51l-51%201M19%2045c-2%202-2%202-3%201-2-3-4-2-4%202%200%202%200%202%205%202%207%201%2011%202%2014%207l4%203v2l1%202v1l1-2h8l4-1c4-1%204-3%200-4l-3-2%202-2c4-3%204-4%201-3l-3-1-1-1-2%201c0%202-2%201-3-1l-1-1-1%202c1%201-1%202-2%200h-1l-1-1-1-1-3-2c-4-4-8-5-11-1'%20fill='%23573ede'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":4.363636363636363,"src":"/static/a0a9b6c2d71bc1b167824a17c016c73e/0979f/banner.jpg","srcSet":"/static/a0a9b6c2d71bc1b167824a17c016c73e/9e575/banner.jpg 500w,\n/static/a0a9b6c2d71bc1b167824a17c016c73e/79449/banner.jpg 1000w,\n/static/a0a9b6c2d71bc1b167824a17c016c73e/0979f/banner.jpg 1920w","srcWebp":"/static/a0a9b6c2d71bc1b167824a17c016c73e/14e3c/banner.webp","srcSetWebp":"/static/a0a9b6c2d71bc1b167824a17c016c73e/7fe04/banner.webp 500w,\n/static/a0a9b6c2d71bc1b167824a17c016c73e/d619e/banner.webp 1000w,\n/static/a0a9b6c2d71bc1b167824a17c016c73e/14e3c/banner.webp 1920w","sizes":"(max-width: 1920px) 100vw, 1920px"}}},"bannerCredit":null,"slug":"/blog/config-files","tags":["前端","整理"]},"headings":[],"body":"const _excluded = [\"components\"];\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nfunction _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }\nfunction _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }\n/* @jsx mdx */\n\nconst _frontmatter = {\n \"slug\": \"config-files\",\n \"title\": \"🔰 前端编辑器常见配置文件\",\n \"date\": \"2019-11-27 01:17:36\",\n \"author\": \"Ubug\",\n \"description\": \"项目根目录会有很多配置文件，今天梳理一下有哪些，不是罗列，而是感叹下前端现在的工具和配置的 “艺术”\",\n \"categories\": [\"code\"],\n \"tags\": [\"前端\", \"整理\"],\n \"banner\": \"./banner.jpg\"\n};\nconst makeShortcode = name => function MDXDefaultShortcode(props) {\n console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n return mdx(\"div\", props);\n};\nconst layoutProps = {\n _frontmatter\n};\nconst MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n let {\n components\n } = _ref,\n props = _objectWithoutProperties(_ref, _excluded);\n return mdx(MDXLayout, _extends({}, layoutProps, props, {\n components: components,\n mdxType: \"MDXLayout\"\n }), mdx(\"hr\", null), mdx(\"blockquote\", null, mdx(\"p\", {\n parentName: \"blockquote\"\n }, \"\\u60F3\\u5206\\u4EAB\\u7684\\u662F\\u73B0\\u4EE3\\u524D\\u7AEF\\u590D\\u6742\\u7684\\u5DE5\\u7A0B\\u5316\\u65B9\\u6848\\uFF0C\\u5176\\u4E2D\\u9700\\u8981\\u7684\\u5404\\u79CD\\u914D\\u7F6E\\u6587\\u4EF6\\uFF0C\\u5E94\\u8BE5\\u6CA1\\u6709\\u51E0\\u4E2A\\u6587\\u4EF6\\u6CA1\\u89C1\\u8FC7\\u5427~\\n\\u6BCF\\u6B21\\u65B0\\u6280\\u672F\\u3001\\u65B0\\u9700\\u6C42\\u6765\\u4E34\\uFF0C\\u5927\\u547C\\u5B66\\u4E0D\\u52A8\\u4E86\\u7684\\u4F60\\uFF0C\\u770B\\u5230\\u8FD9\\u4E9B\\u53C8\\u8981\\u62AB\\u4E0A\\u6218\\u7532\\u3001\\u62FF\\u8D77\\u952E\\u76D8\\u51B2\\u554A!!!\")), mdx(\"hr\", null), mdx(\"p\", null, \"\\u4E0B\\u9762\\u7684\\u8868\\u683C\\u662F\\u6309\\u7167\\u81EA\\u5DF1\\u51E0\\u4E2A\\u9879\\u76EE\\u91CC\\u9762\\u7528\\u5230\\u7684\\u4E00\\u4E9B\\u65B9\\u6848\\u7684\\u6587\\u4EF6\\uFF0C\\u4E5F\\u7B97\\u662F\\u76EE\\u524D\\u5E38\\u89C1\\u7684\\u4E00\\u4E9B\\u4E86\\uFF0C\\u5177\\u4F53\\u57FA\\u672C\\u4E0A\\u6839\\u636E\\u6587\\u4EF6\\u540D\\u5C31\\u80FD\\u770B\\u51FA\\u662F\\u4EC0\\u4E48\\u7684\\u914D\\u7F6E\\u4E86\\uFF1A\"), mdx(\"table\", null, mdx(\"thead\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"thead\"\n }, mdx(\"th\", {\n parentName: \"tr\",\n \"align\": null\n }, \"name\"), mdx(\"th\", {\n parentName: \"tr\",\n \"align\": null\n }, \"tech\"), mdx(\"th\", {\n parentName: \"tr\",\n \"align\": null\n }, \"desc\"))), mdx(\"tbody\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"package.json\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"npm\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"node \\u5305\\u7684\\u914D\\u7F6E\\uFF0C\\u73B0\\u5728\\u53D1\\u5C55\\u4E3A\\u524D\\u7AEF\\u901A\\u7528\\u7684\\u9879\\u76EE\\u914D\\u7F6E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".eslint.json / .eslint.js / .eslintrc / .eslintrc.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"ESlint\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u8BED\\u6CD5\\u3001\\u95EE\\u9898\\u3001\\u98CE\\u683C\\u68C0\\u67E5\\u548C\\u81EA\\u52A8\\u4FEE\\u590D\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".lintstagedrc / lint-staged.config.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"lint-staged\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u914D\\u5408 Git \\u6765\\u8FC7\\u6EE4\\u4FEE\\u6539\\u7684\\u6587\\u4EF6\\uFF0C\\u4EE5\\u4FBF\\u505A\\u63D0\\u4EA4\\u524D\\u68C0\\u67E5\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".huskyrc\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"husky\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u5B9E\\u73B0 git hook \\u65B9\\u4FBF\\u5728 git \\u7684\\u5904\\u7406\\u9636\\u6BB5\\u5904\\u7406\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".eslintignore\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"ESlint\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"ESlint \\u5FFD\\u7565\\u68C0\\u67E5\\u7684\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".perttierrc / .prettier.config.js / .prettierignore\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"prettier\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u4EE3\\u7801\\u98CE\\u683C\\u5316\\u5DE5\\u5177\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".babelrc\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Babel\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u8BED\\u6CD5\\u7F16\\u8BD1\\u5DE5\\u5177\\uFF0C\\u65B0\\u8BED\\u6CD5\\u7F16\\u8BD1\\u4E3A\\u6D4F\\u89C8\\u5668\\u517C\\u5BB9\\u7248\\u672C\\uFF0C\\u524D\\u7AEF\\u53D1\\u5C55\\u7684\\u57FA\\u77F3\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".browserslistrc\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"browserslist\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u6307\\u5B9A\\u76EE\\u6807\\u6D4F\\u89C8\\u5668\\uFF0C\\u5F88\\u591A\\u63D2\\u4EF6\\u6BD4\\u5982 babel \\u6839\\u636E\\u8FD9\\u4E2A\\u914D\\u7F6E\\u6765\\u786E\\u8BA4\\u7F16\\u8BD1\\u76EE\\u6807\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".env / .envrc / .env.development / .env.production / .env.production.local\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u73AF\\u5883\\u53D8\\u91CF\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u4E00\\u822C\\u901A\\u7528\\u7684\\u73AF\\u5883\\u53D8\\u91CF\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".gitignore\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Git\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Git \\u5FFD\\u7565\\u6587\\u4EF6\\u5217\\u8868\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".nvmrc / .node-version\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"avn avn-nvm\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"avn \\u4F7F\\u7528 nvm \\u81EA\\u52A8\\u5207\\u6362\\u9879\\u76EE\\u4E0Bnode \\u7248\\u672C\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"jest.config.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"jest\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u4E00\\u4E2A\\u524D\\u7AEF\\u6D4B\\u8BD5\\u652F\\u6301\\u5E93\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"tsconfig.json\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"TypeScript\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"TS \\u8BED\\u6CD5\\u652F\\u6301\\u7684\\u914D\\u7F6E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"yarn.lock\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Yarn\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Yarn \\u7684\\u4F9D\\u8D56\\u6587\\u4EF6\\u9501\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"package-lock.json\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"NPM\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"NPM \\u7684\\u4F9D\\u8D56\\u6587\\u4EF6\\u9501\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".vscode\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"VSCode\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u7F16\\u8F91\\u5668\\u5DE5\\u4F5C\\u533A\\u914D\\u7F6E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"lerna.json\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Lerna\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Lerna \\u524D\\u7AEF\\u5305\\u9879\\u76EE\\u5FAE\\u67B6\\u6784\\u914D\\u7F6E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"typings.d.ts\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"TypeScript\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"TS \\u5168\\u5C40\\u58F0\\u660E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".gitlab-ci.yml\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Gitlab\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Gitlab \\u6301\\u7EED\\u7EE7\\u627F\\u670D\\u52A1\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"AUTHORS / README.md / HISTORY.md / CONTRIBUTING.md / COPYING / LICENCE / CHANGELOG.md\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Docs\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u5E38\\u89C1\\u7684\\u9879\\u76EE\\u6587\\u6863\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".travis.yml\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"travis\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"Travis \\u6301\\u7EED\\u7EE7\\u627F\\u914D\\u7F6E\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \".npmignore\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"NPM\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u6253\\u5305\\u5FFD\\u7565\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"rollup.config.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"rollup\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"rollup \\u914D\\u7F6E\\u6587\\u4EF6\\u5165\\u53E3\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"webpack.config.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"webpack\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"webpack \\u914D\\u7F6E\\u6587\\u4EF6\\u5165\\u53E3\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"components.json\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"shadcn\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n })), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"tailwind.config.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"tailwind\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"tailwind \\u914D\\u7F6E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"next.config.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"next\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"next \\u914D\\u7F6E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"postcss.config.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"postcss\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"postcss \\u914D\\u7F6E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"tailwind.config.js\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"tailwind\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"tailwind \\u914D\\u7F6E\\u6587\\u4EF6\")))), mdx(\"p\", null, \"\\u5E38\\u89C1\\u6587\\u4EF6\\u5939\\uFF0C\\u8FD9\\u4E2A\\u4E0D\\u540C\\u7684\\u9879\\u76EE\\u7ED3\\u6784\\u7528\\u5904\\u4E0D\\u540C\\uFF0C\\u4F46\\u662F\\u5927\\u90E8\\u5206\\u6587\\u4EF6\\u5939\\u540D\\u5B89\\u6392\\u76F8\\u4F3C\\uFF1A\"), mdx(\"table\", null, mdx(\"thead\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"thead\"\n }, mdx(\"th\", {\n parentName: \"tr\",\n \"align\": null\n }, \"name\"), mdx(\"th\", {\n parentName: \"tr\",\n \"align\": null\n }, \"usage\"))), mdx(\"tbody\", {\n parentName: \"table\"\n }, mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"node_modules\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"npm \\u4F9D\\u8D56\\u6587\\u4EF6\\u5939\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"src\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u6E90\\u7801\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"config\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u9879\\u76EE\\u811A\\u672C\\u914D\\u7F6E\\u6587\\u4EF6\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"build\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u6784\\u5EFA\\u811A\\u672C\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"dist\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u5BFC\\u51FA\\u76EE\\u5F55\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"vendor\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u7B2C\\u4E09\\u65B9\\u5E93\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"src/pages\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u9875\\u9762\\u5206\\u5272\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"src/components\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u7EC4\\u4EF6\\u6587\\u4EF6\\u5939\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"src/static\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u9759\\u6001\\u6587\\u4EF6\\u5939\\uFF0C\\u4E0D\\u7F16\\u8BD1\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"src/assets\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u8D44\\u6E90\\u6587\\u4EF6\\u5939\\uFF0C\\u9700\\u7F16\\u8BD1\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"src/utils\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u652F\\u6301\\u5DE5\\u5177\\u5E93\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"src/apis\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u7F51\\u7EDC\\u8BF7\\u6C42\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"src/models\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u6570\\u636E\\u6A21\\u578B\")), mdx(\"tr\", {\n parentName: \"tbody\"\n }, mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"libs\\u3001plugins\\u3001views\\u3001styles\\u3001theme\\u3001layout\\u3001imgs\"), mdx(\"td\", {\n parentName: \"tr\",\n \"align\": null\n }, \"\\u5176\\u4ED6\\u6587\\u4EF6\\u540D\")))), mdx(\"p\", null, \"\\u5217\\u51FA\\u6765\\u7684\\u8FD9\\u4E9B\\u53EA\\u662F\\u4E00\\u90E8\\u5206\\uFF0C\\u6240\\u4EE5\\u80FD\\u770B\\u51FA\\u6765\\u524D\\u7AEF\\u754C\\u76EE\\u524D\\u7684\\u5DE5\\u5177\\u652F\\u6301\\u751F\\u6001\\u591A\\u4E48\\u7684\\u4E30\\u5BCC\\uFF0C\\u8D8A\\u6765\\u8D8A\\u590D\\u6742\\u7684\\u524D\\u7AEF\\u914D\\u7F6E\\u4E5F\\u6B63\\u8BF4\\u660E\\u4E86\\u5149\\u521D\\u59CB\\u5316\\u4E00\\u4E2A\\u9879\\u76EE\\u5C31\\u9700\\u8981\\u4E0D\\u5C11\\u7CBE\\u529B\\u3002\"), mdx(\"p\", null, \"\\u672F\\u4E1A\\u6709\\u4E13\\u653B\\uFF0C\\u9879\\u76EE\\u4E2D\\u6BCF\\u4E2A\\u9700\\u6C42\\uFF0C\\u90FD\\u80FD\\u5F15\\u5165\\u4E00\\u4E2A\\u5DE5\\u5177\\u652F\\u6301\\uFF0C\\u76F8\\u5173\\u7684\\u914D\\u7F6E\\u548C\\u7528\\u6CD5\\u5B98\\u7F51\\u548C\\u793E\\u533A\\u90FD\\u6709\\u8BE6\\u7EC6\\u7684\\u6587\\u6863\\uFF0C\\u751A\\u81F3\\u7F16\\u8F91\\u5668\\u652F\\u6301 \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"http://schemastore.org/json/\"\n }, \"json schema\"), \" \\u4E5F\\u80FD\\u63D0\\u4F9B\\u4E00\\u5B9A\\u7A0B\\u5EA6\\u7684\\u8BED\\u6CD5\\u63D0\\u793A\\uFF0C\\u6240\\u4EE5\\u8FD9\\u4E5F\\u662F\\u8BF4\\u660E\\u9700\\u6C42\\u9010\\u6E10\\u7EC6\\u5316\\u7684\\u76EE\\u524D\\u524D\\u7AEF\\u751F\\u6001\\u7279\\u70B9\\u3002\"), mdx(\"p\", null, \"\\u6BCF\\u6B21\\u65B0\\u6280\\u672F\\u3001\\u65B0\\u9700\\u6C42\\u6765\\u4E34\\uFF0C\\u5927\\u547C\\u5B66\\u4E0D\\u52A8\\u4E86\\u7684\\u4F60\\uFF0C\\u770B\\u5230\\u8FD9\\u4E9B\\u53C8\\u8981\\u62AB\\u4E0A\\u6218\\u7532\\u3001\\u62FF\\u8D77\\u952E\\u76D8\\u51B2\\u554A\", mdx(\"del\", {\n parentName: \"p\"\n })));\n}\n;\nMDXContent.isMDXComponent = true;"}},"pageContext":{"isCreatedByStatefulCreatePages":false,"id":"bd5bc321-fdda-5ed6-b08b-71974372143b","prev":{"fileAbsolutePath":"D:/ubug/storybook/content/blog/workpad/workpad-part-1.md","id":"362ef756-e712-5e50-b663-d88e9c40a8c8","parent":{"name":"workpad-part-1","sourceInstanceName":"blog"},"excerpt":"先看效果演示： 一、为什么要做 在我刚开始入门的时候，当时用 CodeMirror 做了一个前端 Demo 系统，类似 JSFiddle 可以用原生的 html 、 css 、 js 保存展示代码，然后在博客内引入代码和效果，这是代码编辑器的最初版本。后来看到 vscode 的火热，突发奇想想搬到浏览器端，实现真正的云端开发环境。 当时做这个的想法比较初始，还没有现在很多云服务商或者大公司内部提供的在线开发平台，毕竟当时浏览器下虽然有 Eclipse Che ， Cloud…","fields":{"title":"🌋 WebIDE 的开发记录其一（前言和概览）","slug":"/blog/workpad-part-1","description":"WorkPad 是一个非常有意思的项目，花了很多空闲时间打磨，光基础架构的重构就好几遍，现在略微记录下开发的思路和想法。本文为第一篇文章，谈谈想法、技术栈、基础核心等。","date":"2019-12-24","redirects":null,"datetime":"2019-12-24 10:58:09","categories":["webide"],"series":"WebIDE 的开发记录","tags":["思考","整理","WorkPad","WebIDE","云开发","在线编辑器"],"status":"online"},"frontmatter":{"published":null,"tags":["思考","整理","WorkPad","WebIDE","云开发","在线编辑器"],"theme":null,"slug":"workpad-part-1","date":"2019-12-24 10:58:09"},"body":"const _excluded = [\"components\"];\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nfunction _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }\nfunction _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }\n/* @jsx mdx */\n\nconst _frontmatter = {\n \"slug\": \"workpad-part-1\",\n \"title\": \"🌋 WebIDE 的开发记录其一（前言和概览）\",\n \"date\": \"2019-12-24 10:58:09\",\n \"author\": \"Ubug\",\n \"description\": \"WorkPad 是一个非常有意思的项目，花了很多空闲时间打磨，光基础架构的重构就好几遍，现在略微记录下开发的思路和想法。本文为第一篇文章，谈谈想法、技术栈、基础核心等。\",\n \"series\": \"WebIDE 的开发记录\",\n \"categories\": [\"webide\"],\n \"tags\": [\"思考\", \"整理\", \"WorkPad\", \"WebIDE\", \"云开发\", \"在线编辑器\"],\n \"banner\": \"./WorkPad-demo.png\"\n};\nconst makeShortcode = name => function MDXDefaultShortcode(props) {\n console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n return mdx(\"div\", props);\n};\nconst WithFigcaption = makeShortcode(\"WithFigcaption\");\nconst layoutProps = {\n _frontmatter\n};\nconst MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n let {\n components\n } = _ref,\n props = _objectWithoutProperties(_ref, _excluded);\n return mdx(MDXLayout, _extends({}, layoutProps, props, {\n components: components,\n mdxType: \"MDXLayout\"\n }), mdx(\"p\", null, \"\\u5148\\u770B\\u6548\\u679C\\u6F14\\u793A\\uFF1A\"), mdx(\"div\", {\n style: {\n display: 'flex',\n justifyContent: 'center'\n }\n }, mdx(WithFigcaption, {\n title: \"\\u8FD0\\u884C\\u6548\\u679C\",\n mdxType: \"WithFigcaption\"\n }, mdx(\"video\", {\n autoPlay: true,\n loop: true,\n controls: true,\n style: {\n width: '100%'\n }\n }, mdx(\"source\", {\n src: \"https://fdb.ubug.io/storybook-videos/workpad-video.mp4\",\n type: \"video/mp4\"\n })))), mdx(\"h2\", null, \"\\u4E00\\u3001\\u4E3A\\u4EC0\\u4E48\\u8981\\u505A\"), mdx(\"p\", null, \"\\u5728\\u6211\\u521A\\u5F00\\u59CB\\u5165\\u95E8\\u7684\\u65F6\\u5019\\uFF0C\\u5F53\\u65F6\\u7528 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"CodeMirror\"), \" \\u505A\\u4E86\\u4E00\\u4E2A\\u524D\\u7AEF \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Demo\"), \" \\u7CFB\\u7EDF\\uFF0C\\u7C7B\\u4F3C \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"JSFiddle\"), \" \\u53EF\\u4EE5\\u7528\\u539F\\u751F\\u7684 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"html\"), \"\\u3001\", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"css\"), \"\\u3001\", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"js\"), \" \\u4FDD\\u5B58\\u5C55\\u793A\\u4EE3\\u7801\\uFF0C\\u7136\\u540E\\u5728\\u535A\\u5BA2\\u5185\\u5F15\\u5165\\u4EE3\\u7801\\u548C\\u6548\\u679C\\uFF0C\\u8FD9\\u662F\\u4EE3\\u7801\\u7F16\\u8F91\\u5668\\u7684\\u6700\\u521D\\u7248\\u672C\\u3002\\u540E\\u6765\\u770B\\u5230 vscode \\u7684\\u706B\\u70ED\\uFF0C\\u7A81\\u53D1\\u5947\\u60F3\\u60F3\\u642C\\u5230\\u6D4F\\u89C8\\u5668\\u7AEF\\uFF0C\\u5B9E\\u73B0\\u771F\\u6B63\\u7684\\u4E91\\u7AEF\\u5F00\\u53D1\\u73AF\\u5883\\u3002\"), mdx(\"p\", null, \"\\u5F53\\u65F6\\u505A\\u8FD9\\u4E2A\\u7684\\u60F3\\u6CD5\\u6BD4\\u8F83\\u521D\\u59CB\\uFF0C\\u8FD8\\u6CA1\\u6709\\u73B0\\u5728\\u5F88\\u591A\\u4E91\\u670D\\u52A1\\u5546\\u6216\\u8005\\u5927\\u516C\\u53F8\\u5185\\u90E8\\u63D0\\u4F9B\\u7684\\u5728\\u7EBF\\u5F00\\u53D1\\u5E73\\u53F0\\uFF0C\\u6BD5\\u7ADF\\u5F53\\u65F6\\u6D4F\\u89C8\\u5668\\u4E0B\\u867D\\u7136\\u6709 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Eclipse Che\"), \"\\uFF0C\", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Cloud9\"), \" \\u7B49\\u65B9\\u6848\\uFF0C\\u4F46\\u662F\\u5F00\\u53D1\\u4F53\\u9A8C\\u786E\\u5B9E\\u5F88\\u5DEE\\u3002\\u800C\\u73B0\\u5728\\u51FA\\u73B0 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"theia\"), \"\\u3001\", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"code-server\"), \" \\u975E\\u5E38\\u4F18\\u79C0\\u800C\\u4E14\\u5F00\\u6E90\\u7684\\u9879\\u76EE\\uFF0C\\u7528\\u6237\\u4F53\\u9A8C\\u548C\\u672C\\u5730\\u5F00\\u53D1\\u51E0\\u4E4E\\u6CA1\\u5DEE\\uFF0C\\u518D\\u52A0\\u4E0A\\u5BB9\\u5668\\u5316\\u6280\\u672F\\u975E\\u5E38\\u6210\\u719F\\u7684\\u73B0\\u5728\\uFF0C\\u6D4F\\u89C8\\u5668\\u4E2D\\u968F\\u65F6\\u5C55\\u5F00\\u5F00\\u53D1\\u73AF\\u5883\\u7684\\u8F7B\\u91CF\\u7EA7 IDE \\u5DF2\\u7ECF\\u6210\\u4E3A\\u73B0\\u5B9E\\u4E86\\u3002\"), mdx(\"p\", null, \"\\u53EF\\u60DC\\u5F53\\u65F6\\u6211\\u51C6\\u5907\\u5F00\\u53D1\\u7684\\u65F6\\u5019\\u662F 18 \\u5E74\\u4E0B\\u534A\\u5E74\\uFF0C\\u8FD9\\u4E9B\\u4E1C\\u897F\\u90FD\\u6CA1\\u6709\\u90A3\\u4E48\\u6210\\u719F\\u6216\\u8005\\u53D1\\u5E03\\uFF0C\\u6574\\u4E2A\\u9879\\u76EE\\u505A\\u4E0B\\u6765\\uFF0C\\u8E29\\u4E86\\u5F88\\u591A\\u5751\\uFF0C\\u4E0D\\u8FC7\\u786E\\u5B9E\\u6536\\u83B7\\u662F\\u5DE8\\u5927\\u7684\\u3002\"), mdx(\"p\", null, \"\\u800C\\u4E14\\u5176\\u4E2D\\u5F88\\u591A\\u7528\\u5230\\u7684\\u6280\\u672F\\uFF0C\\u6B63\\u597D\\u5F53\\u65F6\\u53C2\\u52A0\\u4E86\\u817E\\u8BAF\\u65D7\\u4E0B \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Coding\"), \" \\u4E3B\\u529E\\u7684 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"CloudIDE\"), \" \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"https://studio.qcloud.coding.net/campaign/favorite-plugins/detail\"\n }, \"\\u63D2\\u4EF6\\u6BD4\\u8D5B\"), \"\\uFF0C\\u5F00\\u53D1\\u4E86 9 \\u4E2A\\u63D2\\u4EF6\\uFF0C\\u5728140+\\u4E2A\\u63D2\\u4EF6\\u4E2D\\u62FF\\u5230\\u4E86 3 \\u4E2A\\u4F18\\u80DC\\u4E00\\u7B49\\u5956\\u548C 5 \\u4E2A\\u524D\\u4E94\\u4F18\\u79C0\\u5956\\uFF0C\\u4F18\\u80DC\\u63D2\\u4EF6\\u751A\\u81F3\\u88AB\\u5B98\\u65B9\\u5185\\u7F6E\\uFF0C\\u771F\\u662F\\u610F\\u5916\\u60CA\\u559C\\uFF0C\\u8FD8\\u56E0\\u6B64\\u63D0\\u4F9B\\u4E86\\u597D\\u51E0\\u6B21\\u5DE5\\u4F5C\\u673A\\u4F1A\\uFF0C\\u867D\\u7136\\u6CA1\\u53BB\\u5F88\\u9057\\u61BE\\u3002\"), mdx(\"p\", null, mdx(\"figure\", {\n parentName: \"p\",\n \"className\": \"gatsby-resp-image-figure\",\n \"style\": {}\n }, \"\\n \", mdx(\"span\", {\n parentName: \"figure\",\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"762px\"\n }\n }, \"\\n \", mdx(\"a\", {\n parentName: \"span\",\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/d4634d854e6eb9eda534113992f6bb22/faaa2/reward.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": [\"noopener\"]\n }, \"\\n \", mdx(\"span\", {\n parentName: \"a\",\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"68.33976833976834%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAOCAYAAAAvxDzwAAAACXBIWXMAAAsSAAALEgHS3X78AAADXElEQVQ4yz2RW1NbVRiG92+wN7YQIOSwd87ZJDsnIMEUaUbBItPOcFEVeyPW1pnKjVcde+MvcZzxJ+idM53RqaJlwEISQnMkgXDKAXIqPK5sKBfPrLXXfr9vvev9pNJ2h3LpgFQqx85OkdZpl7Nmh9NGW9C53jdqXQ5KQluusr1doHZ8Kv5dai/Xrq6T2s0epeK+TiZTEBSplA/ZqxzpHFRPqO6fUK+d0ay1KZWqZLO7pNI5crmyrunr9/eOOTpsiIatHvV6l0a9Q7Pe0gvfuWuKtVlvc96DXueC9lmPk6OGcNu61vTP3tFrXyD1OrC5+juFTErcuEc+X9FvPT5qcnLcpHZyKlzW9CZnzTY//fwLr9ZTbCWzIqISu8Lx7pXrYmGv7/CccmaN/Js0axsZXv69zqu1LTY3d3gtSKfzJFNZvaglXBxWDqkmMzQO63Tb57qzTuvttUupf9gRLtsHNZr5Ei0Rckdc0n/mefeSi7fo32enoqHIM72RIi0cZrIVkXmJLTHQZCovci0g9TNJioDTG0n+efGSUr6sD6hYqAhX/WGJGK7Crx/VON4/YF1o/3jxJ6u//cq/f63yev0/itkchTdZpPj0hywlbvNpfAp/MMzExCSTfSajxGIxfX//3n2++voRXy5/x4OnP/Lt9894+miFpYcrLC4/48Hj53z+5DlfPPkB6dbAAAGjgaBiZXBoCMPgIMMjIxjE/v2bN7lx4z3sgRjehWXk+CLTC5+x9Pgb4pPTOCOzWIJzWAIfY4t8gje2gGS2WPC7XUIwQSAQwOf3o7kc2GUrNrMJs2EA+0QCdXEF3/xDErNzTH10l/DtO0SCfqIRjbCmEo9FuDubQPKMaaihcbRIFJfqR3Z5ccgKssWKbFVQbTa8fg0tFCE4+QGxO3NEZ2YJTc0gKzZsDjd2hwuH043PpyFZZDN2l4ziNGO1j+qYFCMmeQSjQLaZUN1OXC4nqtdDKBggLAhoPqyyCdluRdXGUP1uAkEVyW41o3mcBFVR4LDiEiK3YtbxCpThQdHMTVQMaDwcZmY8TDgyTigUwumW8YzJjIVVfEGHaGoXGRqFq1ETFqMJo2FIMHy1DjEqGL41gKIoeDweMfEJ7s3Pk0gkiEajmPsZW2XxZAc2RcbldPA/0+7wFcsU8LYAAAAASUVORK5CYII=')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n }), \"\\n \", mdx(\"img\", {\n parentName: \"a\",\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"比赛优胜\",\n \"title\": \"比赛优胜\",\n \"src\": \"/static/d4634d854e6eb9eda534113992f6bb22/faaa2/reward.png\",\n \"srcSet\": [\"/static/d4634d854e6eb9eda534113992f6bb22/2c191/reward.png 259w\", \"/static/d4634d854e6eb9eda534113992f6bb22/86b01/reward.png 518w\", \"/static/d4634d854e6eb9eda534113992f6bb22/faaa2/reward.png 762w\"],\n \"sizes\": \"(max-width: 762px) 100vw, 762px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n }), \"\\n \"), \"\\n \"), \"\\n \", mdx(\"figcaption\", {\n parentName: \"figure\",\n \"className\": \"gatsby-resp-image-figcaption\"\n }, \"\\u6BD4\\u8D5B\\u4F18\\u80DC\"), \"\\n \")), mdx(\"p\", null, \"\\u65F6\\u95F4\\u4E45\\u8FDC\\uFF0C\\u5F53\\u65F6\\u7684\\u8BBE\\u8BA1\\u548C\\u60F3\\u6CD5\\u6CA1\\u6709\\u96C6\\u4E2D\\u6574\\u7406\\uFF0C\\u4F46\\u662F\\u5F88\\u503C\\u5F97\\u8BB0\\u5F55\\uFF0C\\u6682\\u65F6\\u60F3\\u5230\\u7684\\u5728\\u6B64\\u8BB0\\u5F55\\u4E0B\\uFF01\"), mdx(\"div\", {\n \"style\": {},\n \"'flex',\": \"\",\n \"justifycontent:\": \"\",\n \"'center',\": \"\",\n \"textalign:\": \"\",\n \"'center'}}\": \"\"\n }, \"\\n \", mdx(\"figure\", {\n parentName: \"div\",\n \"className\": \"gatsby-resp-image-figure\"\n }, \"\\n \", mdx(\"img\", {\n parentName: \"figure\",\n \"src\": \"/workpad-f7b6355c096f677b088d2189a95b6a29.svg\",\n \"width\": 100\n }), \"\\n \", mdx(\"figcaption\", {\n parentName: \"figure\",\n \"className\": \"gatsby-resp-image-figcaption\"\n }, \"\\u715E\\u6709\\u5176\\u4E8B\\u7684 P \\u4E86\\u4E2A logo\"), \"\\n \")), mdx(\"p\", null, \"\\u8FD8\\u662F\\u5305\\u542B\\u4E86\\u5F88\\u591A\\u7684\\u529F\\u80FD\\u7684\\uFF0C\\u7F16\\u8F91\\u5668\\u3001\\u6587\\u4EF6\\u7BA1\\u7406\\u5668\\u3001\\u641C\\u7D22\\u3001GIT\\u3001\\u8FD0\\u884C\\u73AF\\u5883\\u3001\\u7EC8\\u7AEF\\u7B49\\uFF0C\\u7B97\\u662F\\u6BD4\\u8F83\\u5B8C\\u6574\\u7684\\u5F00\\u53D1\\u73AF\\u5883\\u4E86\\uFF0C\\u80FD\\u505A\\u4E00\\u70B9\\u7B80\\u5355\\u8F7B\\u91CF\\u7684\\u5F00\\u53D1\\u5DE5\\u4F5C\\u3002\"), mdx(\"h2\", null, \"\\u4E8C\\u3001\\u622A\\u6B62\\u76EE\\u524D\\u7684\\u6574\\u4F53\\u67B6\\u6784\"), mdx(\"p\", null, mdx(\"figure\", {\n parentName: \"p\",\n \"className\": \"gatsby-resp-image-figure\",\n \"style\": {}\n }, \"\\n \", mdx(\"span\", {\n parentName: \"figure\",\n \"className\": \"gatsby-resp-image-wrapper\",\n \"style\": {\n \"position\": \"relative\",\n \"display\": \"block\",\n \"marginLeft\": \"auto\",\n \"marginRight\": \"auto\",\n \"maxWidth\": \"1035px\"\n }\n }, \"\\n \", mdx(\"a\", {\n parentName: \"span\",\n \"className\": \"gatsby-resp-image-link\",\n \"href\": \"/static/f40c40289c831a613822af07a8011413/d9d45/WorkPad.png\",\n \"style\": {\n \"display\": \"block\"\n },\n \"target\": \"_blank\",\n \"rel\": [\"noopener\"]\n }, \"\\n \", mdx(\"span\", {\n parentName: \"a\",\n \"className\": \"gatsby-resp-image-background-image\",\n \"style\": {\n \"paddingBottom\": \"71.81467181467181%\",\n \"position\": \"relative\",\n \"bottom\": \"0\",\n \"left\": \"0\",\n \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAOCAYAAAAvxDzwAAAACXBIWXMAAAsSAAALEgHS3X78AAAC+ElEQVQ4y3WTu28cVRTGTf6GKBKbgoqOhgohGkpo6OhAFICQKCgiIQFFGkRBQYAqZZAiHhKSZVBkgom9sUUSLzveeO04O2vvzsY7j527O7PznjuPe+fjjL28THKlT2fOOff+9M3MuUusu75Ur+df/2QJMM4BeIIikkVKSRkpIYlFj51756MvTzhLRRI8VUdw53zC87tuyDskxXJjxXQihXmJYs8TZR5lih9nCgu4MqO+F3FlHvI27e1GCV9DHpw/AZZpdApEcNGNC8w4sK1FeOXzO7j0jYLV1hGWf+9DGTiYeAXusQI7LMfQCjD2SjDaz3zuk/PGAhj+BWzMwizR3Qy/dm3xzPsr4o0r62J5QxHXb7bFRkcTmuWJH9qGWDtg4lB3xZAl5cjJCJia9AmePuuw4YQZN8nFb3t29ewHP+Otr5pY3tjB9ZsKbt8f4dgO8NOujaY6gzYJQEA5npc10CaHZ4FhYxpwPnZzArLquUs38OaVdVy70cLVlRaa3TGOdBfX2hOsqS7UYweqGcqRWwM5AeMzwNRp8Fxw5ifQLKfqHFrY06boGx5UAjlhDi8pSOXf0U9LybwYpj0jIP4L9Kd6g4pc5gJxGFU8CZGlMUSZU1niCeukIaWw6V+cfWU0eGjzP/aWoY+2q8ToY/5oH7HRQ6T3kFh9cFKdJ+ZpXk4HspoNUATT/zusgbrZ4e99/xJ+3Py0So86MB5sYT5UwNRtOL07sA5ID+9h1m/h+H4T470t6fVuI5tqjweak13+4cprWG1/XWGiojA6iLu/gKtNVJN9OAebCChPH95CPNiG3t2SsdaG9C07/wcY/svhTvL2ty/gu/XLAo8UWRl35YPLL8vDq+/Kku3LyeoXcv/jF6X62auy6K1KsJ0yHzRRzEbW4xxeTKMpBuYmXOeApqCeBAtC30Vl9+gq0+zOR4A7pKjRlBkkqvljcI95taHTu7xwGLvGBSrSSdApDKuF6meRxcPcn5wIi9qiN0h4Nk7TtAXBL9ScPwEpkF3PFLzh5gAAAABJRU5ErkJggg==')\",\n \"backgroundSize\": \"cover\",\n \"display\": \"block\"\n }\n }), \"\\n \", mdx(\"img\", {\n parentName: \"a\",\n \"className\": \"gatsby-resp-image-image\",\n \"alt\": \"WorkPad 架构\",\n \"title\": \"WorkPad 架构\",\n \"src\": \"/static/f40c40289c831a613822af07a8011413/0dc48/WorkPad.png\",\n \"srcSet\": [\"/static/f40c40289c831a613822af07a8011413/2c191/WorkPad.png 259w\", \"/static/f40c40289c831a613822af07a8011413/86b01/WorkPad.png 518w\", \"/static/f40c40289c831a613822af07a8011413/0dc48/WorkPad.png 1035w\", \"/static/f40c40289c831a613822af07a8011413/d9d45/WorkPad.png 1136w\"],\n \"sizes\": \"(max-width: 1035px) 100vw, 1035px\",\n \"style\": {\n \"width\": \"100%\",\n \"height\": \"100%\",\n \"margin\": \"0\",\n \"verticalAlign\": \"middle\",\n \"position\": \"absolute\",\n \"top\": \"0\",\n \"left\": \"0\"\n },\n \"loading\": \"lazy\"\n }), \"\\n \"), \"\\n \"), \"\\n \", mdx(\"figcaption\", {\n parentName: \"figure\",\n \"className\": \"gatsby-resp-image-figcaption\"\n }, \"WorkPad \\u67B6\\u6784\"), \"\\n \")), mdx(\"p\", null, \"\\u540E\\u53F0\\u4E00\\u4E2A server \\u8D1F\\u8D23\\u627F\\u8F7D\\u63A5\\u53E3\\uFF0C\\u7136\\u540E\\u6587\\u4EF6\\u67E5\\u770B\\u548C\\u64CD\\u4F5C\\u3001git\\u7684\\u67E5\\u770B\\u548C\\u64CD\\u4F5C\\u548C\\u8BED\\u8A00\\u670D\\u52A1\\u5668\\u90FD\\u662F\\u7EDF\\u4E00\\u7684 server \\u8D1F\\u8D23\\uFF0Cdocker \\u4E2D\\u7684\\u73AF\\u5883\\u8D1F\\u8D23\\u63D0\\u4F9B\\u8FD0\\u884C\\u73AF\\u5883\\u548C\\u547D\\u4EE4\\u884C\\u3002\"), mdx(\"p\", null, \"\\u521A\\u5F00\\u59CB\\u7684\\u60F3\\u6CD5\\u5176\\u5B9E\\u66F4\\u60F3\\u5C06\\u6587\\u4EF6\\u3001git\\u3001\\u8BED\\u8A00\\u670D\\u52A1\\u90FD\\u653E\\u5230 docker \\u4E2D\\uFF0C\\u4F46\\u662F\\u5982\\u679C\\u8FD9\\u6837\\u6BCF\\u4E2A\\u5BB9\\u5668\\u5185\\u90FD\\u8981\\u5305\\u542B\\u4E00\\u5957\\u670D\\u52A1\\uFF0C\\u8FD9\\u4E5F\\u5C31\\u8FDD\\u80CC\\u4E86\\u8F7B\\u91CF\\u5E72\\u51C0\\u7684\\u521D\\u8877\\uFF0C\\u6240\\u4EE5\\u670D\\u52A1\\u5668\\u5C06\\u8FD9\\u4E9B\\u5265\\u79BB\\uFF0C\\u5BB9\\u5668\\u770B\\u8D77\\u6765\\u5C31\\u662F\\u4E00\\u4E2A\\u5E72\\u51C0\\u7684\\u5BB9\\u5668\\u73AF\\u5883\\u6302\\u8F7D\\u6587\\u4EF6\\u800C\\u5DF2\\u3002\"), mdx(\"h2\", null, \"\\u4E09\\u3001\\u5FC3\\u5F97\"), mdx(\"p\", null, \"\\u8F83\\u5927\\u578B\\u7684\\u9879\\u76EE\\u7684\\u7CFB\\u7EDF\\u548C\\u529F\\u80FD\\u96C6\\u6210\\u771F\\u7684\\u6CA1\\u6709\\u90A3\\u4E48\\u7B80\\u5355\\uFF0C\\u6574\\u4E2A\\u9879\\u76EE\\u5F02\\u5E38\\u590D\\u6742\\uFF0C\\u6BCF\\u4E2A\\u529F\\u80FD\\u3001\\u673A\\u5236\\u548C\\u754C\\u9762\\u90FD\\u82B1\\u4E86\\u975E\\u5E38\\u591A\\u7684\\u7CBE\\u529B\\u6253\\u78E8\\uFF0C\\u5BF9\\u4E8E\\u8FD9\\u7C7B\\u8F83\\u5927\\u9879\\u76EE\\u6709\\u5F88\\u591A\\u7684\\u6536\\u83B7\\uFF1A\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, \"Typescript\")), mdx(\"p\", null, \"\\u4E00\\u4E2A\\u590D\\u6742\\u5927\\u578B\\u9879\\u76EE\\u5FC5\\u987B\\u8981\\u7528 Typescript \\u4E0D\\u7136\\u4F1A\\u6B7B\\u4EBA\\u7684\\u3002\\u5176\\u4E2D\\u5F88\\u591A\\u5730\\u65B9\\u53CD\\u590D\\u5C1D\\u8BD5\\u5B9E\\u73B0\\uFF0C\\u4F1A\\u6D89\\u53CA\\u5230\\u5F88\\u591A\\u6B21\\u91CD\\u6784\\uFF0C\\u6BD4\\u5982\\u4E00\\u4E2A\\u6570\\u636E\\u6A21\\u578B\\u7684\\u7ED3\\u6784\\u53D8\\u5316\\u8FD9\\u6837\\u4E00\\u4E2A\\u5E38\\u89C1\\u9700\\u6C42\\uFF0C\\u5982\\u679C\\u6CA1\\u6709\\u7C7B\\u578B\\u63D0\\u793A\\uFF0C\\u6839\\u672C\\u6CA1\\u529E\\u6CD5\\u8FFD\\u8E2A\\u6240\\u6709\\u7684 references \\u7684\\uFF0C\\u5C24\\u5176\\u662F\\u591A\\u4EBA\\u534F\\u4F5C\\u66F4\\u662F\\u707E\\u96BE\\u3002\\u800C\\u4F7F\\u7528 TypeScript \\u540E\\uFF0C\\u4EE3\\u7801\\u63D0\\u793A\\u3001\\u7C7B\\u578B\\u9650\\u5236\\u7B49\\u5BF9\\u6548\\u7387\\u7684\\u63D0\\u5347\\u975E\\u5E38\\u660E\\u663E\\u3002\"), mdx(\"p\", null, \"\\u4E0D\\u597D\\u7684\\u5730\\u65B9\\u662F\\u65E7\\u9879\\u76EE\\u7684\\u5347\\u7EA7\\uFF0C\\u5982\\u679C\\u521A\\u5F00\\u59CB\\u7684\\u65F6\\u5019\\u6CA1\\u6709\\u7528\\uFF0C\\u540E\\u7EED\\u7684\\u6539\\u9020\\u8FD8\\u662F\\u5F88\\u82B1\\u7CBE\\u529B\\u7684\\uFF0C\\u6240\\u4EE5\\u65E0\\u8BBA\\u5927\\u5C0F\\u9879\\u76EE\\uFF0C\\u5F3A\\u70C8\\u63A8\\u8350 TS\\uFF0C\\u5E76\\u4E14\\u6253\\u5F00 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"no-any\"), \" \\u89C4\\u5219\\uFF0C\\u7ECF\\u5386\\u8FC7\\u521A\\u5F00\\u59CB\\u4E0D\\u505C\\u7684\\u5B9A\\u4E49\\u7C7B\\u578B\\u7684\\u9635\\u75DB\\u540E\\uFF0C\\u4F1A\\u975E\\u5E38\\u723D\\uFF0C\\u4EE3\\u7801\\u8D28\\u91CF\\u4E5F\\u4F1A\\u5F88\\u81EA\\u7136\\u7684\\u66F4\\u9AD8\\u3002\"), mdx(\"ol\", {\n \"start\": 2\n }, mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u53EF\\u63A8\\u65AD\\u7F16\\u7A0B\")), mdx(\"p\", null, \"\\u4E0D\\u77E5\\u9053\\u600E\\u4E48\\u63CF\\u8FF0\\u8FD9\\u79CD\\u6A21\\u5F0F\\uFF0C\\u4F8B\\u5982 this \\u5728\\u524D\\u7AEF\\u7684\\u5386\\u53F2\\u4E0A\\u662F\\u4E00\\u4E2A\\u5F88\\u91CD\\u8981\\u7684\\u6982\\u5FF5\\uFF0C\\u56E0\\u4E3A\\u8868\\u610F\\u4E0D\\u660E\\uFF0C\\u4E0D\\u540C\\u7684\\u73AF\\u5883\\u4E0B\\u8981\\u4ED4\\u7EC6\\u5206\\u6790\\u53EF\\u80FD\\u624D\\u4E0D\\u4F1A\\u5F04\\u9519\\uFF0C\\u6240\\u4EE5\\u6211\\u73B0\\u5728\\u5C3D\\u91CF\\u53EA\\u5728 class \\u91CC\\u9762\\u4F7F\\u7528\\uFF1Bredux \\u6982\\u5FF5\\u7684 action type \\u5B57\\u7B26\\u4E32\\u7C7B\\u578B\\uFF0C\\u867D\\u7136\\u53EF\\u4EE5\\u7528\\u5E38\\u91CF\\u6765\\u907F\\u514D\\u62FC\\u5199\\u9519\\u8BEF\\uFF0C\\u4F46\\u662F\\u7528\\u8D77\\u6765\\u80C6\\u6218\\u5FC3\\u60CA\\u7684\\uFF1Begg.js \\u4E2D\\u81EA\\u52A8\\u5E2E\\u4F60\\u6302\\u8F7D\\u7684\\u8DEF\\u7531\\u4E4B\\u7C7B\\u7684\\uFF0C\\u6211\\u628A\\u8FD9\\u53EB\\u505A\\u4E0D\\u53EF\\u63A8\\u65AD\\u7F16\\u7A0B\\u3002\\u7279\\u70B9\\u662F\\u7F16\\u7A0B\\u5DE5\\u5177\\u5F88\\u96BE\\u9759\\u6001\\u7684\\u7ED9\\u4F60\\u4EE3\\u7801\\u63D0\\u793A\\uFF0C\\u6CA1\\u529E\\u6CD5 goto definition\\uFF0C\\u4F60\\u9700\\u8981\\u8BB0\\u5FC6\\u6216\\u8005\\u67E5\\u8BE2\\u624D\\u77E5\\u9053\\u81EA\\u5DF1\\u5199\\u7684\\u5BF9\\u4E0D\\u5BF9\\uFF0C\\u8FD9\\u5F88\\u5BB9\\u6613\\u9020\\u6210\\u8FD0\\u884C\\u65F6\\u9519\\u8BEF\\uFF0C\\u5C24\\u5176\\u662F\\u91CD\\u5EA6\\u4F9D\\u8D56 typescript \\u7684\\u72B6\\u6001\\u4E0B\\uFF0C\\u8FD9\\u7B80\\u76F4\\u50CF\\u662F\\u978B\\u5B50\\u91CC\\u7684\\u77F3\\u5B50\\u90A3\\u6837\\u784C\\u811A\\u3002\"), mdx(\"p\", null, \"\\u7EA6\\u5B9A\\u5927\\u4E8E\\u914D\\u7F6E\\u662F\\u4E0D\\u9519\\u7684\\u5F00\\u53D1\\u6A21\\u5F0F\\uFF0C\\u4F46\\u662F\\u5927\\u578B\\u9879\\u76EE\\u548C\\u591A\\u4EBA\\u534F\\u4F5C\\u7684\\u65F6\\u5019\\uFF0C\\u7EA6\\u5B9A\\u8FD8\\u662F\\u4E0D\\u8981\\u592A\\u591A\\u3002\\u4E0D\\u53EF\\u63A8\\u65AD\\u7684\\u90E8\\u5206\\u9700\\u8981\\u505A\\u7684\\u6539\\u52A8\\u5C31\\u662F\\u5C06\\u786E\\u5B9A\\u7684\\u5B57\\u7B26\\u4E32\\u53C2\\u6570\\uFF0C\\u53D8\\u6210\\u663E\\u5F0F\\u7684\\u65B9\\u6CD5\\u8C03\\u7528\\uFF0C\\u867D\\u7136\\u7075\\u6D3B\\u6027\\u964D\\u4F4E\\uFF0C\\u4F46\\u662F\\u4E0D\\u4F1A\\u51FA\\u73B0\\u8FD0\\u884C\\u65F6\\u9519\\u8BEF\\u6216\\u8005\\u53C2\\u6570\\u95EE\\u9898\\u4E86\"), mdx(\"ol\", {\n \"start\": 2\n }, mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u6570\\u636E\\u5C42\")), mdx(\"p\", null, \"\\u4E00\\u4E2A\\u5355\\u72EC\\u7684\\u6570\\u636E\\u5C42\\u662F\\u975E\\u5E38\\u91CD\\u8981\\u7684\\uFF0C\\u73B0\\u4EE3\\u524D\\u7AEF\\u6280\\u672F\\u5DF2\\u7ECF\\u53EF\\u4EE5\\u5206\\u4E3A\\u6570\\u636E\\u548C\\u6E32\\u67D3\\u4E24\\u90E8\\u5206\\u4E86\\uFF0C\\u4E00\\u4E2A\\u6570\\u636E\\u5C42\\u51B3\\u5B9A\\u4E86\\u4E00\\u4E2A\\u9875\\u9762\\u662F\\u4EC0\\u4E48\\u6837\\u5B50\\u3002\\u5982\\u679C\\u6570\\u636E\\u5206\\u6563\\u3001\\u4E0E\\u754C\\u9762\\u7CC5\\u6742\\u5728\\u4E00\\u8D77\\uFF0C\\u9879\\u76EE\\u590D\\u6742\\u71B5\\u5C31\\u4F1A\\u8D8A\\u6765\\u8D8A\\u5927\\u5230\\u65E0\\u6CD5\\u7EF4\\u62A4\\u3002\\u800C\\u5206\\u79BB\\u7684\\u9879\\u76EE\\u53EA\\u9700\\u8981\\u7EF4\\u62A4\\u72B6\\u6001\\u5373\\u53EF\\uFF0CUI \\u90FD\\u751A\\u81F3\\u662F\\u53EF\\u4EE5\\u91CD\\u542F\\u7684\\u3002\"), mdx(\"ol\", {\n \"start\": 3\n }, mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u53EF\\u6269\\u5C55\\u67B6\\u6784\")), mdx(\"p\", null, \"\\u4E00\\u4E2A\\u9879\\u76EE\\u53EF\\u4EE5\\u9884\\u89C1\\u7684\\u590D\\u6742\\uFF0C\\u90A3\\u4E48\\u4ECE\\u6700\\u57FA\\u7840\\u7684\\u5EFA\\u8BBE\\u5F00\\u59CB\\u5C31\\u8981\\u8003\\u8651\\u67B6\\u6784\\u4E86\\uFF0C\\u5730\\u57FA\\u6253\\u7684\\u597D\\uFF0C\\u76D6\\u623F\\u6CA1\\u70E6\\u607C\\u3002\\u5C31\\u8FD9\\u4E2A\\u9879\\u76EE\\u7684\\u57FA\\u7840\\u90E8\\u5206\\u521A\\u5F00\\u59CB\\u5C31\\u4FEE\\u6539\\u4E86\\u4E09\\u56DB\\u4E2A\\u7248\\u672C\\uFF0C\\u4ECE\\u80FD\\u7528\\u5230\\u53EF\\u4EE5\\u968F\\u610F\\u6DFB\\u52A0\\u6269\\u5C55\\u6269\\u5C55\\u529F\\u80FD\\uFF0C\\u4ECE\\u5199\\u6B7B\\u7CC5\\u6742\\u5230\\u53EF\\u4EE5\\u63D0\\u4F9B\\u6807\\u51C6\\u683C\\u5F0F\\u6570\\u636E\\u548C\\u7EDF\\u4E00\\u7684\\u6269\\u5C55\\u52A0\\u8F7D\\u8C03\\u7528\\u673A\\u5236\\uFF0C\\u5F00\\u53D1\\u96BE\\u5EA6\\u4ECE\\u5782\\u76F4\\u6DF1\\u5165\\u5230\\u6C34\\u5E73\\u6269\\u5C55\\uFF0C\\u96BE\\u5EA6\\u964D\\u4F4E\\u3002\"), mdx(\"p\", null, \"\\u4E8B\\u5148\\u9884\\u89C1\\u9879\\u76EE\\u7684\\u9700\\u6C42\\u76EE\\u6807\\u3001\\u529F\\u80FD\\u9700\\u6C42\\uFF0C\\u7136\\u540E\\u4E8B\\u5148\\u8FDB\\u884C\\u4EA7\\u54C1\\u8BBE\\u8BA1\\u662F\\u4E00\\u4E2A\\u6210\\u719F\\u7801\\u519C\\u7684\\u6807\\u5FD7\\uFF0C\\u80FD\\u8BA9\\u4F60\\u4ECE\\u7E41\\u6742\\u7684\\u8E29\\u5751\\u4E4B\\u65C5\\u4E2D\\u627E\\u5230\\u80FD\\u591F\\u7F15\\u6E05\\u601D\\u8DEF\\u7684\\u70B9\\u7EBF\\u3002\"), mdx(\"ol\", {\n \"start\": 4\n }, mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u6210\\u719F\\u7684\\u8F6E\\u5B50\")), mdx(\"p\", null, \"\\u8BBE\\u60F3\\u7684\\u65F6\\u5019\\u4F4E\\u4F30\\u4E86\\u6574\\u4E2A\\u9879\\u76EE\\u590D\\u6742\\u5EA6\\uFF0C\\u6240\\u4EE5\\u5F88\\u591A\\u5730\\u65B9\\u60F3\\u81EA\\u5DF1\\u5B9E\\u73B0\\uFF0C\\u4F46\\u662F\\u5176\\u5B9E\\u6709\\u5F88\\u591A\\u5751\\uFF0C\\u5982\\u679C\\u591A\\u82B1\\u70B9\\u65F6\\u95F4\\u68B3\\u7406\\u8C03\\u7814\\u5C31\\u4F1A\\u53D1\\u73B0\\u5176\\u5B9E\\u4E1A\\u5185\\u5F88\\u591A\\u4EBA\\u8D9F\\u8FC7\\u8FD9\\u6761\\u8DEF\\uFF0C\\u82B1\\u70B9\\u65F6\\u95F4\\u7814\\u7A76\\u900F\\u5F7B\\u6BD4\\u786C\\u5543\\u5F97\\u6536\\u76CA\\u8FD8\\u662F\\u5927\\u4E9B\\u7684\\u3002\\u4E0D\\u8FC7\\u53E6\\u4E00\\u65B9\\u9762\\u62FF\\u6765\\u5C31\\u7528\\u53EF\\u80FD\\u4F1A\\u51FA\\u73B0\\u5F88\\u4E0D\\u4F18\\u96C5\\u7684\\u5B9E\\u73B0\\uFF0C\\u8FD8\\u662F\\u8981\\u8003\\u8651\\u5230\\u5B9E\\u9645\\uFF0C\\u6309\\u9700\\u5F15\\u5165\\u6216\\u8005\\u6309\\u9700\\u53D8\\u66F4\\u3002\"), mdx(\"h2\", null, \"\\u56DB\\u3001\\u6838\\u5FC3\\u6280\\u672F\\u6808\"), mdx(\"p\", null, \"\\u6709\\u4E86\\u60F3\\u6CD5\\uFF0C\\u7136\\u540E\\u7B80\\u5355\\u641C\\u7D22\\u4E4B\\u540E\\u601D\\u8DEF\\u5F00\\u9614\\u5F88\\u591A\\uFF0C\\u524D\\u7AEF\\u7684\\u6280\\u672F\\u6808\\u5B8C\\u5168\\u80FD\\u591F\\u5B9E\\u73B0\\u4E91\\u7AEF\\u4EE3\\u7801\\u7684\\u7F16\\u8F91\\u3002\\u5F53\\u65F6\\u975E\\u5E38\\u6D45\\u7684\\u770B\\u4E86 VSC \\u7684\\u4E00\\u4E9B\\u6E90\\u7801\\uFF0C\\u4F46\\u662F\\u4E3B\\u8981\\u60F3\\u770B\\u81EA\\u5DF1\\u80FD\\u5B9E\\u73B0\\u5230\\u4EC0\\u4E48\\u7A0B\\u5EA6\\uFF0C\\u6240\\u4EE5\\u5E76\\u6CA1\\u6709\\u6DF1\\u5165\\u8C03\\u7814 VSC \\u7684\\u67B6\\u6784\\u6216\\u8005\\u63D2\\u4EF6\\u7B49\\uFF0C\\u5F88\\u591A\\u4E1C\\u897F\\u53EF\\u80FD\\u8D70\\u4E86\\u4E00\\u4E9B\\u5F2F\\u8DEF\\u3002\"), mdx(\"h3\", null, \"4.1 \\u7B2C\\u4E00\\u7248\"), mdx(\"p\", null, \"\\u7B2C\\u4E00\\u7248\\u7684\\u60F3\\u6CD5\\u662F\\u5728\\u670D\\u52A1\\u5668\\u4E0A\\u5236\\u5B9A\\u4E00\\u4E2A\\u5DE5\\u4F5C\\u76EE\\u5F55\\uFF0C\\u83B7\\u53D6\\u6587\\u4EF6\\u5217\\u8868\\uFF0C\\u7528\\u7F16\\u8F91\\u5668\\u7F16\\u8F91\\u4FEE\\u6539\\u540E\\u518D\\u4FDD\\u5B58\\uFF0C\\u7136\\u540E\\u7EC8\\u7AEF\\u6765\\u5B9E\\u73B0\\u5176\\u4ED6\\u66F4\\u9AD8\\u7EA7\\u7684\\u529F\\u80FD\\u3002\"), mdx(\"p\", null, \"\\u7528\\u5230\\u7684\\u6280\\u672F\\u6808\\u5F88\\u7B80\\u5355\\u4E3A\\uFF1A\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"a\", {\n parentName: \"li\",\n \"href\": \"https://microsoft.github.io/monaco-editor/index.html\"\n }, \"monaco-editor\"), \" \\u4F5C\\u4E3A\\u7F16\\u8F91\\u5668\\uFF0C\\u652F\\u6301\\u591A \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"Model\"), \" \\u5207\\u6362\\uFF0C\\u4EE3\\u7801\\u9AD8\\u4EAE\\u548C\\u7B80\\u5355\\u7684\\u4EE3\\u7801\\u63D0\\u793A\"), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"a\", {\n parentName: \"li\",\n \"href\": \"https://xtermjs.org/\"\n }, \"Xterm.js\"), \" + \", mdx(\"a\", {\n parentName: \"li\",\n \"href\": \"https://github.com/microsoft/node-pty\"\n }, \"node-pty\"), \" + \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"websocket\"), \" \\u4F5C\\u4E3A\\u524D\\u7AEF\\u7EC8\\u7AEF\\u7684\\u65B9\\u6848\"), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"a\", {\n parentName: \"li\",\n \"href\": \"https://eggjs.org/zh-cn/intro/\"\n }, \"Egg.js\"), \" \\u4F5C\\u4E3A\\u670D\\u52A1\\uFF0C\\u7B80\\u5355\\u6307\\u5B9A\\u6587\\u4EF6\\u5939\\uFF0C\\u63D0\\u4F9B\\u6587\\u4EF6\\u7684\\u589E\\u5220\\u6539\\u67E5 REST API\\uFF0C\\u5B9E\\u73B0\\u6811\\u5F62\\u8D44\\u6E90\\u7BA1\\u7406\\u5668\")), mdx(\"p\", null, \"\\u8FD9\\u4E00\\u5757\\u5B9E\\u73B0\\u8D77\\u6765\\u6BD4\\u8F83\\u7B80\\u5355\\uFF0C\\u5B9E\\u9645\\u65F6\\u95F4\\u82B1\\u8D39\\u66F4\\u591A\\u7684\\u662F\\u57FA\\u7840\\u67B6\\u6784\\u7684\\u5B9E\\u73B0\\uFF0C\\u6BD5\\u7ADF\\u540E\\u7EED\\u66F4\\u591A\\u7684\\u529F\\u80FD\\u642D\\u5EFA\\u90FD\\u662F\\u57FA\\u4E8E\\u6B64\\u3002\"), mdx(\"p\", null, \"\\u671F\\u95F4\\u5B9E\\u73B0\\u4E86\\u5F88\\u591A\\u6709\\u8DA3\\u7684\\u529F\\u80FD\\uFF1A\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"p\", {\n parentName: \"li\"\n }, mdx(\"strong\", {\n parentName: \"p\"\n }, \"\\u6838\\u5FC3\\u7684\\u9875\\u9762\\u5E03\\u5C40\\u548C\\u6570\\u636E\\u7ED3\\u6784\")), mdx(\"ol\", {\n parentName: \"li\"\n }, mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u91C7\\u7528 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"dva\"), \" \\u7684\\u6570\\u636E\\u6A21\\u578B\\uFF0C\\u5C01\\u88C5\\u6570\\u636E\\u5C9B\\uFF0C\\u5206\\u6A21\\u5757\\u63D0\\u4F9B\\u6570\\u636E\\u72B6\\u6001\\uFF0C\\u805A\\u5408\\u6570\\u636E\\u7684\\u64CD\\u4F5C\\u4E3A\\u5355\\u5411\\u6570\\u636E\\u6D41\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u91C7\\u7528 core + extensions \\u6838\\u5FC3\\u529F\\u80FD\\u52A0\\u6269\\u5C55\\u529F\\u80FD\\u67B6\\u6784\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u6838\\u5FC3\\u529F\\u80FD\\u4F7F\\u7528\\u6807\\u51C6\\u7684\\u6570\\u636E\\u7ED3\\u6784\\u6E32\\u67D3\\u51FA\\u5185\\u5BB9\\u9875\\u9762\\uFF0C\\u63D0\\u4F9B action \\u9A71\\u52A8\\u673A\\u5236\\u548C UI \\u63D2\\u69FD\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u6BCF\\u4E2A extension \\u6302\\u8F7D\\u72EC\\u7ACB\\u7684\\u6570\\u636E\\u5C9B\\uFF0C\\u6CE8\\u518C\\u6570\\u636E\\u548C UI \\u7EC4\\u4EF6\\u7684\\u7EDF\\u4E00\\u673A\\u5236\"))), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"p\", {\n parentName: \"li\"\n }, mdx(\"strong\", {\n parentName: \"p\"\n }, \"\\u7075\\u6D3B\\u7684\\u89C6\\u56FE\\u5C42\\u5E03\\u5C40\")), mdx(\"ul\", {\n parentName: \"li\"\n }, mdx(\"li\", {\n parentName: \"ul\"\n }, \"\\u89C6\\u56FE\\u5C42\\u662F\\u63D0\\u4F9B\\u529F\\u80FD\\u7684\\u6838\\u5FC3\\uFF0C\\u521A\\u5F00\\u59CB\\u60F3\\u66F4\\u7075\\u6D3B\\u7684\\u81EA\\u7531\\u5212\\u5206\\u533A\\u57DF\\uFF0C\\u4F46\\u662F\\u5B9E\\u73B0\\u8D77\\u6765\\u6BD4\\u8F83\\u91CD\\u91CF\\uFF0C\\u800C\\u4E14\\u6CA1\\u6709\\u5FC5\\u8981\\uFF0C\\u82B1\\u4E86\\u5F88\\u591A\\u65F6\\u95F4\\u6700\\u540E\\u8FD8\\u662F\\u7167\\u7740 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"VSCode\"), \" \\u7684\\u6837\\u5B50\\u5B9E\\u73B0\\u4E86\\u4E00\\u4E2A\\u6838\\u5FC3\\u533A\\u57DF\\u52A0\\u4E09\\u8FB9\\u8F85\\u52A9\\u533A\\u57DF\\u7684\\u6837\\u5F0F\\uFF0C\\u5305\\u62EC layout -> stack -> tabs + panels \\u7684\\u5C42\\u7EA7\\u67B6\\u6784\\u3002\"))), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"p\", {\n parentName: \"li\"\n }, mdx(\"strong\", {\n parentName: \"p\"\n }, \"monaco-editor \\u7684\\u5355\\u5B9E\\u4F8B\\u591A model \\u5B9E\\u73B0\\uFF0C\")), mdx(\"ul\", {\n parentName: \"li\"\n }, mdx(\"li\", {\n parentName: \"ul\"\n }, \"\\u8FD9\\u4E2A\\u672C\\u8EAB\\u5176\\u5B9E\\u5F88\\u7B80\\u5355\\uFF0Ceditor \\u5B9E\\u4F8B\\u672C\\u8EAB\\u63D0\\u4F9B model \\u548C state \\u7684\\u83B7\\u53D6\\u548C\\u8BBE\\u7F6E\\uFF0C\\u6BD4\\u8F83\\u590D\\u6742\\u7684\\u662F\\u4E00\\u4E2A editor \\u662F\\u4E00\\u4E2A\\u754C\\u9762\\u4E0E\\u63D0\\u4F9B\\u7684 layout/panels \\u673A\\u5236\\u4E0D\\u540C\\uFF0C\\u6700\\u540E\\u6DFB\\u52A0\\u4E86\\u4E00\\u4E2A\\u591A tab \\u516C\\u7528 panel \\u7684\\u7279\\u6B8A\\u673A\\u5236\\u89E3\\u51B3\\u4E86\\u3002\")))), mdx(\"blockquote\", null, mdx(\"p\", {\n parentName: \"blockquote\"\n }, \"\\u8FD9\\u4E9B\\u5185\\u5BB9\\u4E2D\\u503C\\u5F97\\u804A\\u7684\\u90FD\\u4F1A\\u5728\\u540E\\u9762\\u8BE6\\u8BF4\")), mdx(\"h3\", null, \"4.2 \\u7B2C\\u4E8C\\u7248\"), mdx(\"p\", null, \"\\u5B9E\\u73B0\\u4E86\\u7B2C\\u4E00\\u7248\\u4E4B\\u540E\\u53D1\\u73B0\\u5F88\\u591A\\u95EE\\u9898\\uFF0C\\u6BD4\\u5982\\uFF1A\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"p\", {\n parentName: \"li\"\n }, mdx(\"strong\", {\n parentName: \"p\"\n }, \"\\u6CA1\\u529E\\u6CD5\\u591A\\u9879\\u76EE\\u5207\\u6362\\uFF0C\\u5DE5\\u4F5C\\u76EE\\u5F55\\u53EA\\u6709\\u4E00\\u4E2A\")), mdx(\"ul\", {\n parentName: \"li\"\n }, mdx(\"li\", {\n parentName: \"ul\"\n }, \"\\u89E3\\u51B3\\u529E\\u6CD5\\u5C31\\u662F\\u4F7F\\u7528\\u591A\\u76EE\\u5F55\\u7684\\u540E\\u53F0\\u652F\\u6301\\uFF0C\\u524D\\u7AEF\\u52A0\\u53C2\\u6570\\uFF0C\\u540E\\u7AEF\\u5206\\u903B\\u8F91\\u5904\\u7406\\uFF0C\\u8FD9\\u4E2A\\u4E0D\\u662F\\u95EE\\u9898\"))), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"p\", {\n parentName: \"li\"\n }, mdx(\"strong\", {\n parentName: \"p\"\n }, \"\\u4FB5\\u5165\\u6027\\u5F88\\u5F3A\\uFF0C\\u4E00\\u6BB5\\u65F6\\u95F4\\u540E\\u670D\\u52A1\\u5668\\u5C31\\u5B89\\u88C5\\u4E86\\u5F88\\u591A\\u5F00\\u53D1\\u5DE5\\u5177\\u3001\\u670D\\u52A1\\u548C\\u4F9D\\u8D56\\uFF0C\\u4F5C\\u4E3A\\u670D\\u52A1\\u5668\\u4E0D\\u5E94\\u8BE5\\u6709\\u8FD9\\u4E9B\")), mdx(\"ul\", {\n parentName: \"li\"\n }, mdx(\"li\", {\n parentName: \"ul\"\n }, \"\\u89E3\\u51B3\\u65B9\\u6848\\u53EA\\u6709\\u4E00\\u4E2A\\uFF0C\\u5C31\\u662F\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"docker\"), \" \\u5BB9\\u5668\\u6765\\u5C06\\u5DE5\\u4F5C\\u76EE\\u5F55\\u5305\\u542B\\u8FDB\\u6765\"), mdx(\"li\", {\n parentName: \"ul\"\n }, \"\\u7136\\u540E\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"docker exec\"), \" \\u63A5\\u53E3\\u63A5\\u5165 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"websocket\"), \" \\u8FDE\\u63A5\"), mdx(\"li\", {\n parentName: \"ul\"\n }, \"\\u8FD9\\u6837\\u5BB9\\u5668\\u80FD\\u63D0\\u4F9B\\u7EC8\\u7AEF\\uFF0C\\u800C\\u4E14\\u5B89\\u88C5\\u7684\\u670D\\u52A1\\u548C\\u4F9D\\u8D56\\u4E0D\\u4F1A\\u5F71\\u54CD\\u5916\\u90E8\\u670D\\u52A1\\u5668\")))), mdx(\"p\", null, \"\\u6B64\\u65F6\\u6280\\u672F\\u6808\\uFF1A\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u5B9E\\u73B0\\u4E00\\u4E9B \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"docker\"), \" \\u5F00\\u53D1\\u955C\\u50CF\\uFF0C\\u901A\\u8FC7 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"docker api\"), \" \\u7BA1\\u7406\\u8FD0\\u884C\\u73AF\\u5883\\uFF0C\\u8FD0\\u884C\\u7684\\u65F6\\u5019\\u6302\\u8F7D\\u9879\\u76EE\\u6587\\u4EF6\\u5939\"), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"a\", {\n parentName: \"li\",\n \"href\": \"https://microsoft.github.io/monaco-editor/index.html\"\n }, \"monaco-editor\"), \" \\u4F5C\\u4E3A\\u7F16\\u8F91\\u5668\\uFF0C\\u652F\\u6301\\u591A \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"Model\"), \" \\u5207\\u6362\\uFF0C\\u4EE3\\u7801\\u9AD8\\u4EAE\\u548C\\u7B80\\u5355\\u7684\\u4EE3\\u7801\\u63D0\\u793A\"), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"a\", {\n parentName: \"li\",\n \"href\": \"https://xtermjs.org/\"\n }, \"Xterm.js\"), \" + \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"websocket\"), \" + \", mdx(\"a\", {\n parentName: \"li\",\n \"href\": \"https://github.com/apocas/dockerode\"\n }, \"dockerode\"), \".exec \\u4F5C\\u4E3A\\u7EC8\\u7AEF\\u7684\\u65B9\\u6848\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u4F7F\\u7528 \", mdx(\"a\", {\n parentName: \"li\",\n \"href\": \"https://github.com/steveukx/git-js\"\n }, \"simple-git\"), \" \\u83B7\\u53D6/\\u64CD\\u4F5C \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"git\"), \" \\u529F\\u80FD\")), mdx(\"p\", null, \"\\u8FD9\\u4E2A\\u65F6\\u5019 \\u6DFB\\u52A0\\u4E86 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"docker\"), \" \\u548C \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"git\"), \" \\u4E4B\\u540E\\u6709\\u4E86\\u66F4\\u591A\\u60F3\\u8C61\\uFF1A\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"dirty-diff\"), \" \\u7F16\\u8F91\\u5668\\u5FC5\\u5907\\u7684\\u4E00\\u4E2A\\u529F\\u80FD\\uFF0C\\u82B1\\u4E86\\u5F88\\u591A\\u65F6\\u95F4\\u53C2\\u8003 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"vscode\"), \" \\u7684\\u5B9E\\u73B0\\uFF0C\\u5728 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"monaco-editor\"), \" \\u4E0A\\u6DFB\\u52A0\\u4E86\\u8FD9\\u4E2A\\u529F\\u80FD\\u3002\"), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"docker\"), \" \\u7684\\u8FD0\\u884C\\u73AF\\u5883\\uFF0C\\u4F9D\\u9760\\u8FD9\\u4E2A\\u5E72\\u51C0\\u72EC\\u7ACB\\u529F\\u80FD\\uFF0C\\u80FD\\u591F\\u63D0\\u4F9B\\u5F88\\u591A\\u4E0D\\u540C\\u7684 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"workpad-runner\"), \" \\u8FD0\\u884C\\u65F6\\u955C\\u50CF\\uFF0C\\u6BD4\\u5982\\u5185\\u7F6E\\u4E86 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"node\"), \"\\u3001\", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"php\"), \" \\u6216\\u8005 \", mdx(\"inlineCode\", {\n parentName: \"li\"\n }, \"Python\"), \" \\u7684\\u5FEB\\u901F\\u5F00\\u53D1\\u73AF\\u5883\\uFF0C\\u6BCF\\u6B21\\u542F\\u52A8\\u65B0\\u7684\\u5F00\\u53D1\\u9879\\u76EE\\u6307\\u5B9A\\u5177\\u4F53\\u7684\\u955C\\u50CF\\uFF0C\\u8FD9\\u6837\\u4E0D\\u540C\\u9879\\u76EE\\u53EF\\u4EE5\\u6709\\u56FA\\u5B9A\\u5E72\\u51C0\\u7684\\u5F00\\u53D1\\u73AF\\u5883\\u4E86\\u3002\")), mdx(\"blockquote\", null, mdx(\"p\", {\n parentName: \"blockquote\"\n }, \"\\u81F3\\u6B64\\u8FD9\\u4E2A\\u7248\\u672C\\u6BD4\\u8F83\\u81EA\\u6D3D\\u4E86\\uFF0C\\u5404\\u4E2A\\u6A21\\u5757\\u6BD4\\u8F83\\u548C\\u8C10\\u591F\\u7528\\uFF0C\\u540E\\u53F0\\u5B9E\\u73B0\\u7684\\u67B6\\u6784\\u540E\\u7EED\\u6CA1\\u6709\\u8F83\\u5927\\u7684\\u6539\\u52A8\\u4E86\\u3002\")), mdx(\"p\", null, \"-> \\u5728 monaco-editor \\u96C6\\u6210 VSC \\u4E2D\\u7684 dirty-diff \\u529F\\u80FD\\u53EF\\u4EE5\\u67E5\\u770B\\uFF1A \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"/blog/workpad-part-7\"\n }, \"\\uD83C\\uDF0B WebIDE \\u7684\\u5F00\\u53D1\\u8BB0\\u5F55\\u5176\\u4E03\\uFF08DirtyDiff \\u652F\\u6301\\uFF09\")), mdx(\"h3\", null, \"4.3 \\u7B2C\\u4E09\\u7248\"), mdx(\"p\", null, \"\\u7B2C\\u4E8C\\u7248\\u7684\\u96C6\\u6210\\u82B1\\u4E86\\u70B9\\u65F6\\u95F4\\uFF0C\\u5B9E\\u73B0\\u4E4B\\u540E\\u529F\\u80FD\\u786E\\u5B9E\\u4E0D\\u9519\\uFF0C\\u73AF\\u5883\\u72EC\\u7ACB\\u3001\\u7BA1\\u7406\\u65B9\\u4FBF\\u3001\\u529F\\u80FD\\u8F83\\u5168\\uFF0C\\u4F46\\u662F\\u8FD8\\u6709\\u4E0D\\u5C3D\\u5982\\u610F\\uFF1A\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u9AD8\\u4EAE\\u7684\\u903B\\u8F91\\u548C\\u9884\\u60F3\\u4E0D\\u540C\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u4EE3\\u7801\\u63D0\\u793A\\u53EA\\u6709\\u9ED8\\u8BA4\\u548C\\u5F53\\u524D\\u6587\\u4EF6\\u7684\\uFF0C\\u6574\\u9879\\u76EE\\u7684\\u4EE3\\u7801\\u63D0\\u793A\\u505A\\u4E0D\\u5230\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u6CA1\\u6709\\u8C03\\u8BD5\\u529F\\u80FD\")), mdx(\"p\", null, \"\\u8FD9\\u4E00\\u5757\\u8FDB\\u884C\\u4E86\\u5F88\\u591A\\u5C1D\\u8BD5\\uFF0C\\u6D89\\u53CA\\u5230\\u7684\\u7B97\\u662F\\u6BD4\\u8F83\\u6DF1\\u5165\\uFF0C\\u82B1\\u7684\\u65F6\\u95F4\\u4E5F\\u5F88\\u957F\\uFF1A\"), mdx(\"p\", null, mdx(\"strong\", {\n parentName: \"p\"\n }, \"\\u8BED\\u6CD5\\u548C\\u9AD8\\u4EAE\\u90E8\\u5206\")), mdx(\"p\", null, \"\\u4E00\\u756A\\u641C\\u7D22\\u53D1\\u73B0 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"monaco-editor\"), \" \\u7684\\u8BED\\u8A00\\u652F\\u6301\\u4F7F\\u7528\\u7684\\u662F\\u5185\\u7F6E\\u7684 \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"https://microsoft.github.io/monaco-editor/monarch.html\"\n }, \"Monarch\"), \" \\u8FD9\\u4E2A\\u8BED\\u6CD5\\u9AD8\\u4EAE\\u652F\\u6301\\uFF0C\\u8BED\\u8A00\\u7684\\u652F\\u6301\\u4E5F\\u53EA\\u6709\\u901A\\u8FC7 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"worker\"), \" \\u7684 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"js\"), \" \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"ts\"), \" \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"html\"), \" \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"css\"), \" \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"json\"), \" \\u8FD9\\u4E9B\\u3002\\u4F46\\u662F\\u4E1A\\u5185\\u66F4\\u901A\\u7528\\u3001\\u751F\\u6001\\u66F4\\u4E30\\u5BCC\\u7684\\u662F \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"https://macromates.com/manual/en/language_grammars\"\n }, \"Textmate\"), \"\\uFF0C\\u5305\\u62EC \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"VSCode\"), \" \\u4E5F\\u662F\\u7528\\u7684 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Textmate\"), \"\\u3002\\u4F46\\u662F\\u53EF\\u559C\\u7684\\u662F Textmate \\u8BED\\u6CD5\\u7684\\u89E3\\u6790\\u662F\\u7528\\u7684 C \\u8BED\\u8A00\\u652F\\u6301\\u7684\\uFF0C\\u5728 node \\u4E0A\\u5C1A\\u4E14\\u53EF\\u4EE5\\u8003\\u8651\\uFF0C\\u4F46\\u662F\\u6D4F\\u89C8\\u5668\\u7AEF\\u53EA\\u80FD\\u53E6\\u8F9F\\u8E4A\\u5F84\\u4E86\\u3002\"), mdx(\"p\", null, \"-> \\u8BE6\\u7EC6\\u53EF\\u4EE5\\u67E5\\u770B\\u540E\\u9762\\u6587\\u7AE0 \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"/blog/workpad-part-5\"\n }, \"\\uD83C\\uDF0B WebIDE \\u7684\\u5F00\\u53D1\\u8BB0\\u5F55\\u5176\\u4E94\\uFF08monaco-editor + textmate\\uFF09\")), mdx(\"p\", null, mdx(\"strong\", {\n parentName: \"p\"\n }, \"\\u9AD8\\u7EA7\\u4EE3\\u7801\\u63D0\\u793A\")), mdx(\"p\", null, \"\\u4E00\\u4E2A IDE \\u548C\\u7F16\\u8F91\\u5668\\u5F88\\u660E\\u663E\\u7684\\u4F7F\\u7528\\u533A\\u522B\\u5C31\\u662F \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"go to definition\"), \" \\u548C \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"go to references\"), \"\\uFF0C\\u4E5F\\u5C31\\u662F\\u8DF3\\u8F6C\\u5B9A\\u4E49\\u548C\\u5F15\\u7528\\u8DF3\\u8F6C\\uFF0C\\u7F3A\\u5C11\\u4E86\\u8FD9\\u4E2A\\u529F\\u80FD\\uFF0C\\u90A3\\u4E48\\u548C\\u6700\\u7B80\\u5355\\u7684\\u8BB0\\u4E8B\\u672C\\u6709\\u4EC0\\u4E48\\u533A\\u522B\\u3002\\u53EF\\u662F monaco-editor \\u4F5C\\u4E3A\\u4E00\\u4E2A\\u6CA1\\u6709\\u6587\\u4EF6\\u7CFB\\u7EDF\\u652F\\u6301\\u7684\\u5DE5\\u5177\\uFF0C\\u80FD\\u505A\\u7684\\u5F88\\u6709\\u9650\\uFF0C\\u6700\\u591A\\u4E5F\\u53EA\\u662F\\u652F\\u6301\\u5185\\u7F6E \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"addExtraLib\"), \" \\u7684\\u6982\\u5FF5\\u89E3\\u6790\\u4F9D\\u8D56\\u7684\\u6587\\u4EF6\\u5185\\u5BB9\\u3002\\u4F46\\u662F\\u529F\\u80FD\\u7FB8\\u5F31\\uFF0C\\u800C\\u4E14\\u6CA1\\u529E\\u6CD5\\u6269\\u5C55\\u5230\\u5176\\u4ED6\\u7684\\u8BED\\u8A00\\u4E2D\\u53BB\\u3002\\u4E0D\\u8FC7\\u597D\\u5728\\u8FD9\\u4E2A\\u9886\\u57DF\\u5DF2\\u7ECF\\u6709\\u4E86\\u901A\\u7528\\u7684\\u89E3\\u51B3\\u65B9\\u6848\\u4E86\\uFF1A\", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"LSP\"), \"\\uFF0C\\u8FD9\\u4E2A\\u624D\\u662F\\u4E00\\u4E2A\\u7F16\\u8F91\\u5668\\u6838\\u5FC3\\u7684\\u4E1C\\u897F\\uFF0C\\u8FD9\\u4E2A\\u65F6\\u5019\\u56DE\\u60F3\\u4E4B\\u524D\\u7684\\u8003\\u8651\\u771F\\u7684\\u662F\\u592A\\u5E74\\u8F7B\\u3002 \"), mdx(\"p\", null, \"-> \\u4EC0\\u4E48\\u662F \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"LSP\"), \" \\u4EE5\\u53CA\\u600E\\u4E48\\u8FDE\\u63A5\\u8BED\\u8A00\\u670D\\u52A1\\uFF0C\\u8BE6\\u7EC6\\u53EF\\u4EE5\\u67E5\\u770B\\u540E\\u9762\\u6587\\u7AE0 \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"/blog/workpad-part-6\"\n }, \"\\uD83C\\uDF0B WebIDE \\u7684\\u5F00\\u53D1\\u8BB0\\u5F55\\u5176\\u516D\\uFF08LSP \\u652F\\u6301\\uFF09\")), mdx(\"p\", null, mdx(\"strong\", {\n parentName: \"p\"\n }, \"\\u8C03\\u8BD5\\u529F\\u80FD\")), mdx(\"p\", null, \"\\u8FD9\\u4E2A\\u548C \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"LSP\"), \" \\u7684\\u903B\\u8F91\\u662F\\u76F8\\u540C\\u7684\\uFF0C\\u4E5F\\u662F\\u6709\\u7EDF\\u4E00\\u6807\\u51C6 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"DVA\"), \"\\uFF0C\\u4E0D\\u8FC7\\u8FD9\\u4E2A\\u6682\\u65F6\\u8FD8\\u6CA1\\u6709\\u5B9E\\u73B0\\uFF0C\\u540E\\u7EED\\u5982\\u679C\\u6709\\u673A\\u4F1A\\u8865\\u4E0A\\u3002\"), mdx(\"h2\", null, \"\\u4E94\\u3001\\u5176\\u4ED6\"), mdx(\"p\", null, \"\\u5176\\u4ED6\\u529F\\u80FD\\u5305\\u62EC\\u5BA2\\u6237\\u7AEF\\u7684\\u6280\\u672F\\u67B6\\u6784\\u3001\\u67D0\\u4E2A\\u6280\\u672F\\u6808\\u540E\\u9762\\u518D\\u5355\\u72EC\\u6587\\u7AE0\\u8BB2\\u8BB2\\u3002\"));\n}\n;\nMDXContent.isMDXComponent = true;"},"next":{"fileAbsolutePath":"D:/ubug/storybook/content/blog/typescript/typescript.md","id":"d0d2f052-390f-57da-80c8-a426a86d8810","parent":{"name":"typescript","sourceInstanceName":"blog"},"excerpt":"…","fields":{"title":"🏃‍♂️ TypeScript 以及一些理解和技巧","slug":"/blog/typescript","description":"TypeScript 真的是一个很伟大的前端静态类型解决方案，已经离不开了，简单列举一些内容~~","date":"2019-11-21","redirects":null,"datetime":"2019-11-21 11:47:10","categories":["code"],"series":null,"tags":["整理","TypeScript","TS","前端"],"status":"online"},"frontmatter":{"published":null,"tags":["整理","TypeScript","TS","前端"],"theme":null,"slug":"typescript","date":"2019-11-21 11:47:10"},"body":"const _excluded = [\"components\"];\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nfunction _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }\nfunction _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }\n/* @jsx mdx */\n\nconst _frontmatter = {\n \"slug\": \"typescript\",\n \"title\": \"🏃‍♂️ TypeScript 以及一些理解和技巧\",\n \"date\": \"2019-11-21 11:47:10\",\n \"author\": \"Ubug\",\n \"description\": \"TypeScript 真的是一个很伟大的前端静态类型解决方案，已经离不开了，简单列举一些内容~~\",\n \"categories\": [\"code\"],\n \"tags\": [\"整理\", \"TypeScript\", \"TS\", \"前端\"],\n \"banner\": \"./typescript.png\",\n \"bannerCredit\": \"Banner from [typescript](https://www.memsql.com/blog/porting-30k-lines-of-code-from-flow-to-typescript/)\"\n};\nconst makeShortcode = name => function MDXDefaultShortcode(props) {\n console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n return mdx(\"div\", props);\n};\nconst layoutProps = {\n _frontmatter\n};\nconst MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n let {\n components\n } = _ref,\n props = _objectWithoutProperties(_ref, _excluded);\n return mdx(MDXLayout, _extends({}, layoutProps, props, {\n components: components,\n mdxType: \"MDXLayout\"\n }), mdx(\"h3\", null, \"1. \\u53EF\\u63A8\\u65AD\\u7F16\\u7A0B\\u7684\\u4F53\\u9A8C\"), mdx(\"p\", null, \"\\u771F\\u6B63\\u7684\\u9762\\u5411\\u63A5\\u53E3\\u7F16\\u7A0B\\uFF0C\\u66F4\\u81EA\\u7136\\u5B8C\\u5907\\u7684\\u6A21\\u5757\\u548C\\u903B\\u8F91\\u62BD\\u8C61\\uFF0C\\u8BA9\\u524D\\u7AEF\\u5F00\\u53D1\\u7684\\u601D\\u7EF4\\u65B9\\u5F0F\\u4ECE\\u600E\\u4E48\\u5B9E\\u73B0\\u7ED3\\u679C\\uFF0C\\u53D8\\u6210\\u4E86\\u66F4\\u9AD8\\u8D28\\u91CF\\u7684\\u9700\\u6C42\\u4EA4\\u4ED8\\uFF0C\\u53BB\\u601D\\u8003\\u63A5\\u53E3\\u7684\\u8F93\\u5165\\u8F93\\u51FA\\uFF0C\\u53BB\\u8BBE\\u8BA1\\u6A21\\u5757\\u548C\\u4EE3\\u7801\\uFF0C\\u66F4\\u4F55\\u51B5\\u4EC5\\u4EC5\\u662F\\u4EE3\\u7801\\u63D0\\u793A\\u548C\\u5BF9\\u63A5\\u8054\\u8C03\\u5C31\\u8DB3\\u591F\\u8BA9\\u4F60\\u723D\\u7FFB\\u5929\\u4E86\\u3002\"), mdx(\"p\", null, \"\\u590D\\u6742\\u6A21\\u5757\\u4E4B\\u95F4\\u7684\\u96C6\\u6210\\u4ECE\\u6765\\u4E0D\\u662F\\u90A3\\u4E48\\u987A\\u5229\\uFF0C\\u529F\\u80FD\\u7684\\u5347\\u7EA7\\u91CD\\u6784\\u3001\\u9879\\u76EE\\u7684\\u4EA4\\u63A5\\u4E00\\u76F4\\u662F\\u5F00\\u53D1\\u5F88\\u91CD\\u8981\\u7684\\u4E00\\u90E8\\u5206\\uFF0C\\u8FD9\\u5757\\u7ECF\\u5E38\\u4F1A\\u51FA\\u73B0\\u95EE\\u9898\\uFF0C\\u56E0\\u4E3A\\u5E76\\u4E0D\\u662F\\u6BCF\\u4E2A\\u4EBA\\u3001\\u6BCF\\u6B21\\u90FD\\u80FD\\u6E05\\u695A\\u7684\\u8BB0\\u4F4F\\u9879\\u76EE\\u7684\\u63A5\\u53E3\\u3001\\u53C2\\u6570\\u3001\\u7C7B\\u578B\\u7B49\\uFF0C\\u8FD9\\u5757\\u51FA\\u73B0\\u7684\\u9519\\u8BEF\\u5728\\u524D\\u7AEF\\u5360\\u4E86\\u5F88\\u5927\\u4E00\\u4E2A\\u6BD4\\u4F8B\\uFF0C\\u6240\\u4EE5\\u5F88\\u591A\\u7684\\u6D4B\\u8BD5\\u624D\\u80FD\\u8986\\u76D6\\u8FD9\\u5757\\u7684\\u8D28\\u91CF\\u4FDD\\u8BC1\\u3002\\u53EF\\u662F\\uFF0C\\u8FD9\\u5BF9\\u4E8E\\u9759\\u6001\\u8BED\\u8A00\\u5176\\u5B9E\\u5E76\\u4E0D\\u662F\\u95EE\\u9898\\u3002\"), mdx(\"p\", null, \"\\u4E4B\\u524D\\u7684\\u524D\\u7AEF\\u4EE3\\u7801\\u63D0\\u793A\\u4F9D\\u8D56\\u4E8E document \\u6CE8\\u91CA\\uFF0C\\u8FD9\\u5176\\u5B9E\\u5BF9\\u5F88\\u591A\\u4EBA\\u662F\\u4E00\\u79CD\\u8D1F\\u62C5\\uFF0C\\u5F88\\u591A\\u4EBA\\u53EA\\u4F7F\\u7528\\u5185\\u7F6E\\u7684\\u5B98\\u65B9\\u63D0\\u793A\\uFF0C\\u4E0D\\u80FD\\u4EAB\\u53D7\\u7C7B\\u578B\\u601D\\u7EF4\\u7684\\u597D\\u5904\\u3002TS \\u4F7F\\u7528\\u4E00\\u4E9B\\u6807\\u8BB0\\u548C\\u7C7B\\u578B\\u58F0\\u660E\\u80FD\\u591F\\u5F88\\u597D\\u7684\\u5B9E\\u73B0\\u5B8C\\u6574\\u7684\\u4EE3\\u7801\\u63D0\\u793A\\uFF0C\\u5E26\\u6709\\u4EE3\\u7801\\u63D0\\u793A\\u7684\\u7F16\\u7A0B\\u4F53\\u9A8C\\u80FD\\u8BA9\\u6548\\u7387\\u548C\\u8D28\\u91CF\\u66F4\\u597D\\uFF0C\\u81F3\\u5C11\\u4EE3\\u7801\\u8D28\\u91CF\\u91CC\\u9762\\u9759\\u6001\\u68C0\\u67E5\\u6CA1\\u6709\\u95EE\\u9898\\u4E86\\u3002\"), mdx(\"p\", null, \"\\u8FD9\\u90FD\\u662F Typescript \\u5E26\\u6765\\u7684\\u91CD\\u8981\\u7279\\u6027\\uFF0CTS \\u80FD\\u5E2E\\u6211\\u4EEC\\u68B3\\u7406\\u6E05\\u4E0D\\u540C\\u7684\\u63A5\\u53E3\\u3001\\u5929\\u751F\\u7684\\u8BA9\\u4F60\\u77E5\\u9053\\u8FD9\\u4E2A\\u63A5\\u53E3\\u5E94\\u8BE5\\u600E\\u4E48\\u6837\\u7684\\uFF0C\\u5728\\u8FD0\\u884C\\u65F6\\u624D\\u80FD\\u770B\\u5230\\u7684\\u95EE\\u9898\\u5728\\u5F00\\u53D1\\u7684\\u65F6\\u5019\\u5C31\\u5F88\\u660E\\u663E\\u7684\\u66B4\\u9732\\u4E86\\u3002\"), mdx(\"h3\", null, \"2. type \\u548C interface \\u7684\\u533A\\u522B\"), mdx(\"blockquote\", null, mdx(\"p\", {\n parentName: \"blockquote\"\n }, \"TL;DR: \\u5185\\u90E8\\u4F7F\\u7528\\u53EA\\u8981\\u7A0B\\u5E8F\\u4E00\\u81F4\\uFF0C\\u90FD\\u53EF\\u4EE5\\uFF0Ctype \\u66F4\\u77ED\\u66F4\\u7075\\u6D3B\\u3002\\u63D0\\u4F9B\\u7B2C\\u4E09\\u65B9\\u5E93\\u58F0\\u660E\\u7684\\u65F6\\u5019\\u8BF7\\u4F7F\\u7528 interface\\u3002\")), mdx(\"p\", null, \"\\u521A\\u63A5\\u89E6\\u7684\\u65F6\\u5019\\u90FD\\u4F1A\\u7EA0\\u7ED3\\u5230\\u5E95\\u662F\\u7528\\u54EA\\u4E2A\\u6765\\u5B9A\\u4E49\\u7C7B\\u578B\\uFF0C\\u5B98\\u7F51\\u7684\\u8BF4\\u660E\\u4E2D\\u4E00\\u822C\\u662F\\u8FD9\\u4E48\\u53EB\\u7684 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"interface = interface types\"), \" \\u63A5\\u53E3\\u7C7B\\u578B\\uFF0C\", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"type = type aliases\"), \" \\u7C7B\\u578B\\u522B\\u540D\\u3002\\u4F46\\u662F\\u5B98\\u7F51\\u5F88\\u591A\\u8868\\u8FF0\\u73B0\\u5728\\u6709\\u70B9\\u95EE\\u9898\\uFF0C\\u76EE\\u524D\\u53EF\\u4EE5\\u53C2\\u8003 \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"https://medium.com/@martin_hotell/interface-vs-type-alias-in-typescript-2-7-2a8f1777af4c\"\n }, \"Interface vs Type alias in TypeScript 2.7\"), \"\\u3002\"), mdx(\"p\", null, \"\\u547D\\u540D\\u4E0A\\u4E00\\u4E2A\\u5F3A\\u8C03\\u63A5\\u53E3\\uFF0C\\u4E00\\u4E2A\\u5F3A\\u8C03\\u522B\\u540D\\uFF0C\\u6240\\u4EE5\\u6309\\u7167\\u6211\\u7684\\u7406\\u89E3\\uFF1A\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"strong\", {\n parentName: \"li\"\n }, \"interface \\u4F5C\\u4E3A\\u4E00\\u4E2A\\u6574\\u4F53\\u6765\\u63CF\\u8FF0\\u4E00\\u4E2A\\u5B9E\\u4F53\\u63A5\\u53E3\\u3002\")), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"strong\", {\n parentName: \"li\"\n }, \"type \\u4F5C\\u4E3A\\u522B\\u540D\\u4F7F\\u7528\\uFF0C\\u4E00\\u822C\\u8F83\\u591A\\u7684\\u8868\\u793A\\u96C6\\u5408\\u6982\\u5FF5\\u3002\")), mdx(\"li\", {\n parentName: \"ol\"\n }, mdx(\"strong\", {\n parentName: \"li\"\n }, \"\\u4E8C\\u8005\\u5728\\u8868\\u793A\\u5E38\\u89C1\\u7684\\u7ED3\\u6784\\u65F6\\uFF0C\\u53EF\\u4EE5\\u4E92\\u76F8\\u8F6C\\u6362\\u3002\"))), mdx(\"p\", null, \"\\u6BD4\\u5982 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"interface\"), \" \\u5F3A\\u8C03 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"People\"), \" \\u4EBA\\u7684\\u6570\\u636E\\u7ED3\\u6784\\uFF0C\\u5B8C\\u6574\\u7684\\u7C7B\\u578B\\u3002\", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"type\"), \" \\u5F3A\\u8C03\\u4E00\\u4E2A\\u6709\\u59D3\\u540D\\u3001\\u5E74\\u9F84\\u7B49\\u5C5E\\u6027\\u7684\\u96C6\\u5408\\u4F53\\uFF0C\\u522B\\u540D\\u548C\\u96C6\\u5408\\u3002\\u6211\\u4EEC\\u5E73\\u65F6\\u4F7F\\u7528\\u7684\\u65F6\\u5019\\uFF0C\\u4E0D\\u9700\\u8981\\u523B\\u610F\\u5F3A\\u8C03\\u54EA\\u4E2A\\u662F\\u5BF9\\u7684\\uFF0C\\u56E0\\u4E3A\\u5927\\u90E8\\u5206\\u65F6\\u5019\\u65E0\\u8BBA\\u58F0\\u660E \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"interface\"), \" \\u8FD8\\u662F \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"type\"), \" \\u5BF9\\u4E8E\\u7A0B\\u5E8F\\u903B\\u8F91\\u90FD\\u662F\\u6709\\u610F\\u4E49\\u53EF\\u63A8\\u65AD\\u7684\\uFF0C\\u5927\\u90E8\\u5206\\u65F6\\u5019\\u4E5F\\u662F\\u53EF\\u4EE5\\u4E92\\u76F8\\u8F6C\\u6362\\u7684\\u3002\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"interface People {\\n name: string;\\n age: number;\\n}\\n\")), mdx(\"p\", null, \"\\u5927\\u90E8\\u5206\\u60C5\\u51B5\\u53EF\\u4EE5\\u5199\\u6210\\uFF1A\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"type People = {\\n name: string;\\n age: number;\\n}\\n\")), mdx(\"p\", null, \"\\u4E8C\\u8005\\u4E4B\\u95F4\\u4E00\\u4E9B\\u4E0D\\u540C\\u7684\\u8BED\\u6CD5\\uFF0C\\u6BD4\\u5982\\u53EA\\u6709 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"interface\"), \" \\u53EF\\u4EE5\\u6709\\u58F0\\u660E\\u5408\\u5E76 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"declaration merging\"), \" \\u4E00\\u822C\\u591A\\u4EBA\\u534F\\u4F5C\\u6216\\u8005\\u7B2C\\u4E09\\u65B9\\u63A5\\u53E3\\u6269\\u5C55\\u6BD4\\u8F83\\u6709\\u7528\\u3002\"), mdx(\"h3\", null, \"3. \\u4E0D\\u8981\\u4F7F\\u7528 Any!\\u4E0D\\u8981\\u4F7F\\u7528 Any!\"), mdx(\"p\", null, \"\\u63A5\\u89E6 TS \\u521A\\u5F00\\u59CB\\uFF0C\\u5F88\\u591A\\u7684\\u7C7B\\u578B\\u58F0\\u660E\\u8BA4\\u4E3A\\u6CA1\\u5FC5\\u8981\\uFF0C\\u53EF\\u4EE5\\u7701\\u7565\\uFF0C\\u6240\\u4EE5\\u6DFB\\u52A0\\u4E86\\u5F88\\u591A\\u7684 any \\u5230\\u4EE3\\u7801\\u91CC\\u9762\\uFF0C\\u4F46\\u662F\\u8FD9\\u662F\\u5F88\\u4E0D\\u597D\\u7684\\u7F16\\u7A0B\\u5B9E\\u8DF5\\u3002\"), mdx(\"p\", null, \"\\u9664\\u975E\\u7B2C\\u4E09\\u65B9\\u4EE3\\u7801\\uFF0C\\u4E0D\\u8981\\u4F7F\\u7528 any \\u6765\\u4EC5\\u4EC5\\u4E3A\\u4E86\\u53BB\\u9664\\u7EA2\\u7EBF\\u63D0\\u793A\\uFF0C\\u53EF\\u4EE5\\u4F7F\\u7528\\u81EA\\u52A8\\u63A8\\u65AD\\u6765\\u51CF\\u5C11 any \\u7684\\u4F7F\\u7528\\u3002\"), mdx(\"ol\", null, mdx(\"li\", {\n parentName: \"ol\"\n }, \"any \\u662F\\u4E00\\u4E2A\\u4EE3\\u7801 bug \\u9690\\u60A3\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u4EE3\\u7801\\u7684\\u6BCF\\u4E00\\u4E2A\\u89D2\\u843D\\u90FD\\u9700\\u8981\\u7C7B\\u578B\\u58F0\\u660E\\uFF0C\\u4E0D\\u8981\\u4EE5\\u4E3A\\u6A21\\u5757\\u7B80\\u5355\\u3001\\u975E\\u6838\\u5FC3\\u5C31\\u76F4\\u63A5 any \\u4E86\\u4E8B\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u4EE3\\u7801\\u7684\\u91CD\\u6784\\u5982\\u679C\\u6CA1\\u6709\\u7C7B\\u578B\\u58F0\\u660E\\u652F\\u6301\\u5C06\\u4F1A\\u5F88\\u4E0D\\u53EF\\u9760\"), mdx(\"li\", {\n parentName: \"ol\"\n }, \"\\u6CA1\\u6709\\u81EA\\u52A8\\u8865\\u5168\\u652F\\u6301\")), mdx(\"p\", null, \"\\u5C3D\\u53EF\\u80FD\\u7684\\u5C06\\u4E0D\\u80FD\\u81EA\\u52A8\\u63A8\\u65AD\\u7684\\u7C7B\\u578B\\u624B\\u52A8\\u6807\\u6CE8\\u7C7B\\u578B\\u58F0\\u660E\\uFF0C\\u8FD9\\u662F\\u7F16\\u7A0B\\u7684\\u4E00\\u90E8\\u5206\\u3002\"), mdx(\"h3\", null, \"4. \\u660E\\u786E\\u53EF\\u4EE5\\u81EA\\u52A8\\u63A8\\u65AD\\u7684\\uFF0C\\u53EF\\u4EE5\\u4E0D\\u7528\\u5199\\u7C7B\\u578B\\u58F0\\u660E\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"// \\u660E\\u786E\\u7C7B\\u578B\\u7684\\u503C\\u521D\\u59CB\\u5316\\uFF0C\\u80FD\\u591F\\u81EA\\u52A8\\u63A8\\u5012\\u53D8\\u91CF\\u7C7B\\u578B\\nlet someVal = 10;\\nconst someObj = { key1: 'val1', key2: 100 }\\n// ======== \\u4F46\\u662F\\u4E0D\\u80FD\\u5B8C\\u5907\\u521D\\u59CB\\u5316\\u7684\\u9664\\u5916\\uFF0C\\u4F8B\\u5982\\u4E0B\\u9762\\u5C31\\u4F1A\\u51FA\\u9519\\nconst someObj2 = {}\\nsomeObj2.x = 3;\\nsomeObj2.y = 4\\n\")), mdx(\"h3\", null, \"5. any, unknow\"), mdx(\"ul\", null, mdx(\"li\", {\n parentName: \"ul\"\n }, \"any \\u8868\\u793A\\u201C\\u8FD9\\u4E2A\\u6570\\u636E\\u53EF\\u80FD\\u662F\\u4EFB\\u4F55\\u7C7B\\u578B\\uFF0C\\u4E0D\\u7528\\u7BA1\\u201D\"), mdx(\"li\", {\n parentName: \"ul\"\n }, \"unknow \\u8868\\u793A\\u201C\\u8FD9\\u4E2A\\u6570\\u636E\\u4E0D\\u77E5\\u9053\\u662F\\u4EC0\\u4E48\\u7C7B\\u578B\\uFF0C\\u9700\\u8981\\u8FDB\\u4E00\\u6B65\\u68C0\\u67E5\\u201D\")), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-typescript\"\n }, \"let a: any = '123';\\na.say(); // \\u9759\\u6001\\u68C0\\u67E5\\u4E0D\\u4F1A\\u63D0\\u793A\\u95EE\\u9898\\n\\nlet a: unknow = '123';\\na.say(); // \\u9759\\u6001\\u68C0\\u67E5\\u4F1A\\u63D0\\u793A \\\"Object is of type 'unknown'\\\"\\n\\n// \\u81EA\\u52A8\\u63A8\\u65AD\\u540E\\u6536\\u7A84\\u7C7B\\u578B\\uFF0C\\u5141\\u8BB8\\u9759\\u6001\\u68C0\\u67E5\\u901A\\u8FC7\\nif (typeof a.say === 'function') {\\n a.say();\\n}\\n\")), mdx(\"p\", null, \"unknown \\u7C7B\\u578B\\u8981\\u6BD4 any \\u5B89\\u5168\\u5F97\\u591A\\uFF0C\\u5F3A\\u5236\\u6211\\u4EEC\\u5FC5\\u987B\\u8FDB\\u884C\\u68C0\\u67E5\\u624D\\u80FD\\u8FDB\\u4E00\\u6B65\\u6267\\u884C\\uFF0C\\u80FD\\u591F\\u907F\\u514D\\u8FD0\\u884C\\u65F6\\u7684\\u7C7B\\u578B\\u9519\\u8BEF\\u3002\\u4F46\\u662F\\u53EF\\u80FD\\u8FD9\\u4E2A\\u5F3A\\u5236\\u6027\\u6709\\u4E9B\\u5DE5\\u4F5C\\u91CF\\uFF0C\\u6240\\u4EE5\\u53EF\\u80FD\\u5F88\\u591A\\u4EBA\\u8FD8\\u662F any\\u3002\"), mdx(\"h3\", null, \"6. never\"), mdx(\"p\", null, \"\\u4FDD\\u62A4\\u6027\\u7C7B\\u578B\\u3001\\u515C\\u5E95\\u7C7B\\u578B\\u3001\\u5E95\\u90E8\\u7C7B\\u578B\\u3001\\u96F6\\u7C7B\\u578B\\u6216\\u7A7A\\u7C7B\\u578B\\u7B49\\u53EB\\u6CD5\\uFF0C\\u6BD4\\u5982\\u4E0B\\u9762\\u4E00\\u4E2A\\u5E38\\u89C1\\u7684\\u9700\\u6C42\\uFF1A\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-typescript\"\n }, \"type Foo = string | number;\\n\\nfunction runBar(foo: Foo) {\\n if(typeof foo === \\\"string\\\") {\\n // \\u8FD9\\u91CC foo \\u88AB\\u6536\\u7A84\\u4E3A string \\u7C7B\\u578B\\n } else if(typeof foo === \\\"number\\\") {\\n // \\u8FD9\\u91CC foo \\u88AB\\u6536\\u7A84\\u4E3A number \\u7C7B\\u578B\\n }\\n}\\n\")), mdx(\"p\", null, \"\\u8FD9\\u6BB5\\u4EE3\\u7801\\u662F\\u6CA1\\u6709\\u95EE\\u9898\\u7684\\uFF0C\\u63A5\\u6536\\u7684\\u503C\\u6709\\u4E0D\\u540C\\u7684\\u7C7B\\u578B\\u6709\\u4E0D\\u540C\\u7684\\u5904\\u7406\\uFF0C\\u9759\\u6001\\u68C0\\u67E5\\u3001\\u8FD0\\u884C\\u65F6\\u90FD\\u80FD\\u901A\\u8FC7\\u3002\"), mdx(\"p\", null, \"\\u4F46\\u662F\\u5982\\u679C\\u534F\\u4F5C\\u7684\\u65F6\\u5019\\u51FA\\u73B0\\u95EE\\u9898\\uFF1A\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-typescript\"\n }, \"- type Foo = string | number;\\n+ type Foo = string | number | boolean;\\n\\n function runBar(foo: Foo) {\\n if(typeof foo === \\\"string\\\") {\\n // \\u8FD9\\u91CC foo \\u88AB\\u6536\\u7A84\\u4E3A string \\u7C7B\\u578B\\n } else if(typeof foo === \\\"number\\\") {\\n // \\u8FD9\\u91CC foo \\u88AB\\u6536\\u7A84\\u4E3A number \\u7C7B\\u578B\\n }\\n }\\n\")), mdx(\"p\", null, \"\\u8FD9\\u4E2A\\u65F6\\u5019\\u9759\\u6001\\u68C0\\u67E5\\u4E0D\\u4F1A\\u62A5\\u9519\\uFF0C\\u8FD0\\u884C\\u65F6\\u4E5F\\u4E0D\\u4F1A\\u62A5\\u9519\\uFF0C\\u4F46\\u662F\\u903B\\u8F91\\u4E0A\\u5C31\\u662F\\u6709\\u95EE\\u9898\\u7684\\uFF0C\\u6240\\u4EE5\\u521A\\u5F00\\u59CB\\u5E94\\u8BE5\\u4F7F\\u7528 never \\u6765\\u63A7\\u5236\\u7C7B\\u578B\\u7684\\u6D41\\u52A8\\u3002\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-typescript\"\n }, \"type Foo = string | number;\\n\\nfunction runBar(foo: Foo) {\\n if(typeof foo === \\\"string\\\") {\\n // \\u8FD9\\u91CC foo \\u88AB\\u6536\\u7A84\\u4E3A string \\u7C7B\\u578B\\n } else if(typeof foo === \\\"number\\\") {\\n // \\u8FD9\\u91CC foo \\u88AB\\u6536\\u7A84\\u4E3A number \\u7C7B\\u578B\\n } else {\\n // foo \\u5728\\u8FD9\\u91CC\\u662F never\\n const check: never = foo;\\n }\\n}\\n\")), mdx(\"p\", null, \"\\u522B\\u4EBA\\u6539\\u52A8\\u4E4B\\u540E\\u7F16\\u8BD1\\u9636\\u6BB5\\u5C31\\u80FD\\u53D1\\u73B0\\u8FD9\\u91CC\\u7684\\u95EE\\u9898\\u3002\"), mdx(\"h3\", null, \"7. \\u7C7B\\u578B\\u6CDB\\u578B\\u8FD0\\u7B97\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"interface ComponentProps {\\n prop1: string;\\n}\\ninterface ComponentPropsWithChildren{\\n prop1: string;\\n children: React.ReactNode\\n}\\n// =========== \\u53EF\\u4EE5\\u8F6C\\u5316\\u4E3A\\nimport { PropsWithChildren } from 'react';\\ninterface ComponentPropsWithChildren = PropsWithChildren\\n\")), mdx(\"p\", null, \"\\u7528 Pick \\u64CD\\u4F5C\\u7B80\\u5316\\u7C7B\\u578B\\u58F0\\u660E\\uFF1A\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"interface Adult {\\n name: string;\\n age: number;\\n job: string;\\n}\\ninterface Child {\\n name: string;\\n age: number;\\n}\\n// =========== \\u53EF\\u4EE5\\u8F6C\\u5316\\u4E3A\\ntype Child = {\\n [k in 'name' | 'age'] : Adult[k]\\n}\\n// =========== \\u4E5F\\u53EF\\u4EE5\\u8F6C\\u5316\\u4E3A\\ntype Child = Pick\\n\")), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"type SomeObject = { [ key: string ]: string }\\n// =========== \\u4E5F\\u53EF\\u4EE5\\u8F6C\\u5316\\u4E3A\\ntype SomeObject = Record\\n\")), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"interface UserLoginType {\\n username: string;\\n id: number;\\n avatar: string;\\n token: string;\\n}\\n// \\u7528 Omit \\u5254\\u9664\\u5C5E\\u6027\\ntype UserInfo = Omit\\n\")), mdx(\"p\", null, \"\\u53EF\\u4EE5\\u907F\\u514D\\u4E00\\u4E9B\\u91CD\\u590D\\u7684\\u4EE3\\u7801\"), mdx(\"h3\", null, \"8. \\u5185\\u7F6E\\u7684\\u4E00\\u4E9B\\u8F85\\u52A9\\u51FD\\u6570\"), mdx(\"p\", null, \"TS \\u7684\\u6CDB\\u578B\\u662F\\u5F88\\u5F3A\\u5927\\u7684\\u6982\\u5FF5\\uFF0C\\u5728\\u5F88\\u591A\\u6846\\u67B6\\u4E2D\\u90FD\\u80FD\\u770B\\u5230\\u8EAB\\u5F71\\uFF0C\\u662F\\u9759\\u6001\\u7C7B\\u578B\\u63A8\\u65AD\\u5F88\\u91CD\\u8981\\u7684\\u4E00\\u4E2A\\u5730\\u65B9\\u3002ts \\u7684 lib \\u58F0\\u660E\\u6587\\u4EF6\\u4E2D\\u6BD4\\u5982 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"lib.es5.d.ts\"), \" \\u6709\\u5F88\\u591A\\u6709\\u610F\\u601D\\u7684\\u8F85\\u52A9\\u6CDB\\u578B\\u7C7B\\u578B\\u3002\"), mdx(\"p\", null, \"\\u6BCF\\u4E00\\u4E2A\\u90FD\\u5F88\\u7B80\\u6D01\\uFF0C\\u90FD\\u662F\\u62BD\\u8C61\\u51FA\\u6765\\u7684\\u7C7B\\u578B\\u64CD\\u4F5C\\uFF0C\\u6BD4\\u5982\\u4E0A\\u9762\\u8BF4\\u7684 \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Pick\"), \"\\uFF1A\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"class Model {\\n state: Readonly;\\n setState = (state: Pick) => {\\n this.state = { ...this.state, ...state };\\n };\\n}\\n\\n// ========= \\u5F88\\u7B80\\u5355\\u7684\\u7528 Pick \\u6765\\u53EA\\u5141\\u8BB8\\u76EE\\u6807\\u7C7B\\u578B\\u7684 key \\u7684\\u8F93\\u5165\\n\\ntype TodoState = {\\n list: string[];\\n lastUpdate: string;\\n}\\n\\nconst todoModel = new Model();\\ntodoModel.setState({\\n list: ['a1', 'b2'],\\n lastUpdate: '12:01',\\n})\\ntodoModel.setState({\\n unknowKey: '123' // \\u7C7B\\u578B\\u201C{ unknowKey: string; }\\u201D\\u7684\\u53C2\\u6570\\u4E0D\\u80FD\\u8D4B\\u7ED9\\u7C7B\\u578B\\u201CPick\\u201D\\u7684\\u53C2\\u6570\\u3002 ts(2345)\\n})\\n\")), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"/**\\n * Extracts the type of the 'this' parameter of a function type, or 'unknown' if the function type has no 'this' parameter.\\n */\\ntype ThisParameterType = T extends (this: infer U, ...args: any[]) => any ? U : unknown;\\n\\n/**\\n * Removes the 'this' parameter from a function type.\\n */\\ntype OmitThisParameter = unknown extends ThisParameterType ? T : T extends (...args: infer A) => infer R ? (...args: A) => R : T;\\n\\n/**\\n * Make all properties in T optional\\n */\\ntype Partial = {\\n [P in keyof T]?: T[P];\\n};\\n\\n/**\\n * Make all properties in T required\\n */\\ntype Required = {\\n [P in keyof T]-?: T[P];\\n};\\n\\n/**\\n * Make all properties in T readonly\\n */\\ntype Readonly = {\\n readonly [P in keyof T]: T[P];\\n};\\n\\n/**\\n * From T, pick a set of properties whose keys are in the union K\\n */\\ntype Pick = {\\n [P in K]: T[P];\\n};\\n\\n/**\\n * Construct a type with a set of properties K of type T\\n */\\ntype Record = {\\n [P in K]: T;\\n};\\n\\n/**\\n * Exclude from T those types that are assignable to U\\n */\\ntype Exclude = T extends U ? never : T;\\n\\n/**\\n * Extract from T those types that are assignable to U\\n */\\ntype Extract = T extends U ? T : never;\\n\\n/**\\n * Construct a type with the properties of T except for those in type K.\\n */\\ntype Omit = Pick>;\\n\\n/**\\n * Exclude null and undefined from T\\n */\\ntype NonNullable = T extends null | undefined ? never : T;\\n\\n/**\\n * Obtain the parameters of a function type in a tuple\\n */\\ntype Parameters any> = T extends (...args: infer P) => any ? P : never;\\n\\n/**\\n * Obtain the parameters of a constructor function type in a tuple\\n */\\ntype ConstructorParameters any> = T extends new (...args: infer P) => any ? P : never;\\n\\n/**\\n * Obtain the return type of a function type\\n */\\ntype ReturnType any> = T extends (...args: any) => infer R ? R : any;\\n\\n/**\\n * Obtain the return type of a constructor function type\\n */\\ntype InstanceType any> = T extends new (...args: any) => infer R ? R : any;\\n\\n/**\\n * Marker for contextual 'this' type\\n */\\ninterface ThisType { }\\n\\n\")), mdx(\"h3\", null, \"9. \\u914D\\u5408 JSDoc \\u8FDB\\u884C\\u6CE8\\u91CA\"), mdx(\"p\", null, \"\\u7C7B\\u578B\\u58F0\\u660E\\u5F88\\u597D\\u7528\\uFF0C\\u4F46\\u662F\\u6CA1\\u529E\\u6CD5\\u52A0\\u6CE8\\u91CA\\uFF0C\\u6CE8\\u91CA\\u7684\\u6DFB\\u52A0\\u8FD8\\u662F\\u4F9D\\u9760 JSDoc \\u7B49\\u5DE5\\u5177\\uFF0C\\u4F46\\u662F\\u4E0D\\u9700\\u8981\\u5199\\u7C7B\\u578B\\uFF08\\u907F\\u514D\\u7C7B\\u578B\\u4E0E ts \\u4E0D\\u4E00\\u81F4\\uFF09\\u3002\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-ts\"\n }, \"interface People {\\n /**\\n * \\u7528\\u6237\\u540D\\n */\\n name: string;\\n}\\n/**\\n * uid: user id \\u7528\\u6237\\u7684 id\\n*/\\nfunction callSomeOne(uid: number){\\n // # ...\\n}\\n\")), mdx(\"h3\", null, \"10. class \\u7EE7\\u627F\\u4E0D\\u540C\\u7684\\u8D4B\\u503C\\u65B9\\u6CD5\\u7684\\u4EE3\\u7801\\u63D0\\u793A\"), mdx(\"p\", null, \"\\u8FD9\\u4E2A\\u5E76\\u4E0D\\u662F ts \\u7684\\u7279\\u6027\\uFF0C\\u5F88\\u591A\\u65F6\\u5019\\u770B\\u5230\\u4E86\\u4E0D\\u540C\\u7684\\u4EE3\\u7801\\u98CE\\u683C\\uFF0C\\u6BD4\\u5982\\u4E0B\\u9762\\u7684\\u4E24\\u79CD\\uFF1A\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-typescript\",\n \"metastring\": \"{2-4}\",\n \"{2-4}\": true\n }, \"class DemoCom extends React.Component<{}, TDemoState> {\\n state = {\\n statusPool: {}\\n }\\n action = () => {\\n this.state\\n }\\n};\\n\")), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-typescript\",\n \"metastring\": \"{4-6}\",\n \"{4-6}\": true\n }, \"class DemoCom extends React.Component<{}, TDemoState> {\\n constructor(){\\n super();\\n this.state = {\\n statusPool: {}\\n }\\n }\\n action = () => {\\n this.state\\n }\\n};\\n\")), mdx(\"p\", null, \"\\u4E4B\\u524D\\u6211\\u4E00\\u76F4\\u5F88\\u597D\\u5947\\u540E\\u9762\\u8FD9\\u4E2A\\u662F\\u8981\\u5E72\\u561B\\uFF0C\\u8FD9\\u5C82\\u4E0D\\u662F\\u5F88\\u5947\\u602A\\u7684\\u505A\\u6CD5\\u5417\\uFF1F\\u660E\\u660E\\u9759\\u6001\\u7684\\u8D4B\\u503C\\u5C31\\u80FD\\u521D\\u59CB\\u5316\\uFF0C\\u4E3A\\u4EC0\\u4E48\\u8FD8\\u8981\\u5728 constructor \\u91CC\\u9762\\u8FD0\\u884C\\u65F6\\u521D\\u59CB\\u5316\\u5462\\uFF1F\"), mdx(\"p\", null, \"\\u73B0\\u5728\\u660E\\u767D\\u4E86\\uFF0C\\u56E0\\u4E3A React.Component \\u8FD9\\u4E2A\\u7236\\u7C7B\\u5DF2\\u7ECF\\u5728\\u521D\\u59CB\\u5316\\u7684\\u65F6\\u5019\\u62FF\\u5230\\u4E86 state \\u7684\\u6CDB\\u578B\\uFF0C\\u6240\\u4EE5\\u5982\\u679C\\u76F4\\u63A5\\u4F7F\\u7528 this.state \\u80FD\\u591F\\u770B\\u5230\\u4EE3\\u7801\\u63D0\\u793A\\u3002\"), mdx(\"p\", null, \"\\u65B9\\u6CD5\\u4E00\\u91CC\\u9762\\u7684\\u5C5E\\u6027\\uFF0C\\u8986\\u76D6\\u4E86\\u7236\\u7EC4\\u4EF6\\u7684\\u5C5E\\u6027\\uFF0C\\u5BF9\\u4E8E ts \\u6765\\u8BF4\\uFF0C\\u8FD9\\u4E2A state \\u7684\\u6CDB\\u578B\\u5C31\\u5931\\u6548\\u4E86\\uFF0C\\u5F53\\u7136 setState \\u65B9\\u6CD5\\u7684\\u63D0\\u793A\\u8FD8\\u662F\\u652F\\u6301\\u7684\\uFF0C\\u4F46\\u662F\\u76F4\\u63A5 this.state \\u8BBF\\u95EE\\u5C31\\u53D8\\u6210\\u4E86\\u5F53\\u524D\\u5B50\\u7C7B\\u7684 state \\u7684\\u7C7B\\u578B\\u63A8\\u65AD\\u4E86\\uFF0C\\u9664\\u975E\\u663E\\u5F0F\\u518D\\u6307\\u5B9A\\u7C7B\\u578B\\u3002\"), mdx(\"p\", null, \"\\u800C\\u65B9\\u6CD5\\u4E8C\\u6CA1\\u6709\\u7528\\u65B0\\u5C5E\\u6027\\u8986\\u76D6\\u7236\\u7C7B\\u7684\\u5C5E\\u6027\\uFF0C\\u800C\\u662F\\u5728\\u7236\\u7C7B\\u4E0A\\u8D4B\\u503C\\uFF0C\\u6240\\u4EE5\\u4EE3\\u7801\\u63D0\\u793A\\u4F9D\\u7136\\u7528\\u7684\\u662F\\u7236\\u7C7B\\u7684\\u3002\"), mdx(\"pre\", null, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-typescript\"\n }, \"class DemoCom extends React.Component<{}, TDemoState> {\\n // \\u4F7F\\u7528\\u8FD9\\u79CD\\u8D4B\\u503C\\u65B9\\u6CD5\\u4F1A\\u8986\\u76D6\\u6389\\u7236\\u7EC4\\u4EF6\\u7684 state \\u7C7B\\u578B\\u58F0\\u660E\\uFF0C\\u4EE3\\u7801\\u63D0\\u793A\\u5C31\\u4F1A\\u53D8\\u6210\\u8FD9\\u4E2A\\u53D8\\u91CF\\n // state = {\\n // statusPool: {}\\n // }\\n // \\u4F7F\\u7528\\u8FD9\\u79CD\\u8D4B\\u503C\\u65B9\\u6CD5\\u4F1A\\u8986\\u76D6\\u6389\\u7236\\u7EC4\\u4EF6\\u7684 state \\u7C7B\\u578B\\u58F0\\u660E\\uFF0C\\u4F46\\u662F\\u663E\\u5F0F\\u6307\\u5B9A\\u53C8\\u91CD\\u65B0\\u6307\\u5B9A\\u4E86\\n // state: IStatusBarState = {\\n // statusPool: {}\\n // }\\n constructor(){\\n super();\\n // \\u4F7F\\u7528\\u8D4B\\u503C\\u6CD5\\uFF0C\\u53EF\\u4EE5\\u907F\\u514D\\u58F0\\u660E\\u8986\\u76D6\\u7236\\u7EC4\\u4EF6\\u7684 state \\u7C7B\\u578B\\u58F0\\u660E\\uFF0C\\u7701\\u53BB\\u4E86\\u663E\\u5F0F\\u6307\\u5B9A\\n this.state = {\\n statusPool: {}\\n }\\n }\\n action = () => {\\n this.state\\n }\\n};\\n\")));\n}\n;\nMDXContent.isMDXComponent = true;"}}}}